当前位置: 首页 > news >正文

小程序-上传图片功能

在这里插入图片描述
技术前置:

1.框架采用colorUI

2.原生开发

功能:

上传图片

1.上传已经拍摄的图片

2.实时拍摄上传

3.设置上传图片数量,每次上传数量

4.上传等待

ChooseImage() {if(this.data.imgList.length>=4){_this.ErrorEvent("最多上传4张照片");return;}if(this.data.imgList.length>=4){_this.ErrorEvent("最多上传4张照片");return;}if(this.data.Mylatitude==null){this.ErrorEvent("请点击定位送达地址!");return;}if(this.data.Mylongitude==null){this.ErrorEvent("请点击定位送达地址!");return;}var position=this.data.Mylatitude+","+this.data.Mylongitude;wx.chooseImage({count: 1, //默认9sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有sourceType: ['album','camera'], //从相册选择 ,success: (res) => {if(res.tempFilePaths.length<=0){return;}wx.showLoading({title: '正在上传图片',// icon: 'loading',// duration: 5000,mask: true})const tempFilePaths = res.tempFilePaths;var uploadimgs=[];for(var i=0;i<tempFilePaths.length;i++){this.uploadImg(tempFilePaths[i],position);}}});},//上传图片uploadImg(address,longlatData){let reqaddress= app.globalData.baseUrl+ '/uploadPic';let _this=this;wx.uploadFile({url: reqaddress, //仅为示例,非真实的接口地址filePath: address,name: 'file',formData: {'user': 'test'},success (res){const data = res.data;var mdata= JSON.parse(data);wx.hideLoading();if(mdata.code==0){if (_this.data.uploadImgList.length > 0) {_this.setData({uploadImgList:_this.data.uploadImgList.concat(mdata.data.relativePath),})} else {var show="uploadImgList[0]";_this.setData({[show]:mdata.data.relativePath})}if (_this.data.imgList.length != 0) {_this.setData({imgList: _this.data.imgList.concat(address),})} else {var show="imgList[0]";_this.setData({[show]: address,})}_this.HideErrorEvent();wx.showToast({title: '图片上传成功',duration: 1000,})}else{// var count=_this.data.imgList.length;// _this.setData({//   imgList:_this.data.imgList.splice(count-1, 1)// })_this.ErrorEvent("上传图片到服务器失败!请重传");}}, complete() {  },fail(error){wx.hideLoading();console.log(error);// var count=_this.data.imgList.length;// _this.setData({//   imgList:_this.data.imgList.splice(count-1, 1)// })_this.ErrorEvent("上传图片到服务器失败!请重传");}})},

相关文章:

小程序-上传图片功能

技术前置&#xff1a; 1.框架采用colorUI 2.原生开发 功能&#xff1a; 上传图片 1.上传已经拍摄的图片 2.实时拍摄上传 3.设置上传图片数量&#xff0c;每次上传数量 4.上传等待 ChooseImage() {if(this.data.imgList.length>4){_this.ErrorEvent("最多上传4…...

alist基本用法@文档阅读@挂载网盘@网盘webdav挂载

文章目录 alist官网alist网站风格说明alist软件版本 安装和启动使用必看文档&#x1f47a;alist for android版本启动alist网页 典型用例挂载阿里云盘open获取阿里云令牌 主页检查挂载情况 常用页面以配置挂载列表管理配置页面 配置文件和目录&#x1f47a;FAQ可能遇到的错误检…...

Hive正则表达式

Hive版本&#xff1a;hive-3.1.2 一、Hive的正则表达式概述 正则表达式是一种用于匹配和操作文本的强大工具&#xff0c;它是由一系列字符和特殊字符组成的模式&#xff0c;用于描述要匹配的文本模式。 Hive的正则表达式灵活使用解决HQL开发过程中的很多问题&#xff0c;本篇文…...

ubuntu20.04-编译安装Qt5.15.2-C++

文章目录 步骤一&#xff1a;安装依赖项步骤二&#xff1a;下载Qt 5.15源代码步骤三&#xff1a;配置并编译Qt步骤四&#xff1a;配置环境变量注意事项更新于2024年 在Ubuntu 22.04 LTS&#xff08;Jammy Jellyfish&#xff09;环境下编译Qt 5.15&#xff0c;由于Ubuntu 22.04的…...

【PTA|期末复习|编程题】数组相关编程题(二)

目录 7-1 数组元素循环右移问题(20分) 输入格式: 输出格式: 输入样例: 输出样例: 代码 7-2 找出不是两个数组共有的元素(20分) 输入格式: 输出格式: 输入样例: 输出样例: 代码 7-3 方阵循环右移(20分) 输入格式&#xff1a; 输出格式&#xff1a; 输入样例&…...

重温阿里云宝塔面板部署前后端项目

首先祝大家新年快乐啊&#xff01; 回到老家&#xff0c;便打算趁这一段空闲时间提升一下自己&#xff0c;重点是学习实践一下echarts相关内容&#xff0c;很多公司项目都需要实现可视化&#xff0c;所以在bilibili上找了黑马的一个教程开始学习&#xff0c;不同的是&#xff…...

6个好看的wordpress模板

简站wordpress服务业通用主题 2023年立秋纪念版&#xff0c;简站wordpress服务行业通用主题&#xff0c;适合服务行业企业官网使用。 https://www.jianzhanpress.com/?p5393 小语种翻译wordpress主题 小语种国家外贸网站建设需要的wordpress主题模板&#xff0c;适合做小语…...

零基础学python之高级编程(1)---面向对象编程及其类的创建

面向对象编程及其类的创建 文章目录 面向对象编程及其类的创建前言一、面向过程编程和面向对象编程的概念1.面向过程编程(Procedural Programming)2.面向对象编程(Object-Oriented Programming&#xff0c;OOP) 二、面向对象编程基础1.初识类(class)和对象调用方法 2.类中的两种…...

[C# WPF] DataGrid选中行或选中单元格的背景和字体颜色修改

问题描述 WPF中DataGrid的选中行或选中者单元格&#xff0c;在焦点失去后&#xff0c;颜色会很淡&#xff0c;很不明显&#xff0c;不容易区分。 解决方法 在失去焦点的情况下&#xff0c;如何设置行或单元格与选中的时候颜色一样&#xff1f; <DataGrid.Resources>&…...

单片机学习笔记---串口通信(1)

目录 通信的基本概念 通信的方式 1.按照数据传送的方式&#xff0c;可分为串行通信和并行通信。 1.1串行通信 1.2并行通信 2.按照通信的数据同步方式&#xff0c;又可以分为异步通信和同步通信。 2.1 异步通信 2.2同步通信 3.按照数据的传输方向&#xff0c;又可以分为…...

熔断机制解析:如何用Hystrix保障微服务的稳定性

微服务与系统的弹性设计 大家好,我是小黑,在讲Hystrix之前,咱们得先聊聊微服务架构。想象一下,你把一个大型应用拆成一堆小应用,每个都负责一部分功能,这就是微服务。这样做的好处是显而易见的,更新快,容错性强,每个服务可以独立部署,挺美的对吧?但是,问题也随之而…...

第三节 zookeeper基础应用与实战2

目录 1. Watch事件监听 1.1 一次性监听方式&#xff1a;Watcher 1.2 Curator事件监听机制 2. 事务&异步操作演示 2.1 事务演示 2.2 异步操作 3. Zookeeper权限控制 3.1 zk权限控制介绍 3.2 Scheme 权限模式 3.3 ID 授权对象 3.4 Permission权限类型 3.5 在控制台…...

C# Socket通信从入门到精通(21)——Tcp客户端判断与服务器断开连接的三种方法以及C#代码实现

前言 我们开发的tcp客户端程序在连接服务器以后,经常会遇到服务器已经关闭但是作为客户端的我们不知道,这时候应该应该有一个机制我们可以实时监测客户端和服务器已经断开连接,如果已经断开了连接,我们应该及时报警提示用户客户端和服务器已经断开连接,本文介绍三种可以监…...

vulnhub-->hacksudo-Thor靶机详细思路

目录 1. IP探测2.端口服务扫描3.网站漏洞扫描4.目录扫描5.信息分析6.破壳漏洞(Shellshock)nmap---漏洞检测CVE-2014-6271 7.nc反弹8.提权9.service提权 1. IP探测 ┌──(root㉿kali)-[~] └─# arp-scan -l Interface: eth0, type: EN10MB, MAC: 00:0c:29:10:3c:9b, IPv4: 19…...

Java外卖小程序管理系统

技术架构&#xff1a; springboot ssm mysql redis 有需要该项目的小伙伴可以私信我你的Q。 功能描述&#xff1a; 商品管理&#xff1a;新增商品、所有商品 菜单管理&#xff1a;菜单管理、菜单分类 订单管理&#xff1a;订单总览&#xff08;包括未付款、已付款、已…...

挖掘嵌入式系统在物联网和智能设备中的应用潜力

1. 物联网的发展和嵌入式系统 介绍物联网的定义和特点&#xff0c;以及其在各个领域中的应用。探讨物联网对嵌入式系统的需求&#xff0c;包括低功耗、小型化、实时性等特性&#xff0c;以及对嵌入式系统的数据处理和通信能力的要求。 2. 嵌入式系统在智能设备中的应用 分析…...

用docker 配置scala spark环境

要使用Docker配置Scala和Spark环境&#xff0c;您可以按照以下步骤进行操作。以下是一个基本的示例&#xff0c;您可能需要根据您的具体需求进行调整。 安装Docker: 在您的系统上安装Docker。您可以从Docker官方网站下载并安装适用于您操作系统的版本。 创建Dockerfile: 在您的…...

医疗处方架构设计和实现的实战经验总结

医疗处方是医生开具给患者的药物治疗建议。在现代医疗系统中&#xff0c;设计和实现一个高效而可靠的医疗处方架构至关重要。本文将介绍医疗处方架构的设计原则和关键组件&#xff0c;以及如何实现一个可扩展和安全的处方管理系统。 内容&#xff1a; 1. 引言 - 医疗处方的…...

专业140+总分410+华南理工大学811信号与系统考研经验华工电子信息与通信,真题,大纲,参考书。

23考研已经落幕&#xff0c;我也成功的上岸华工&#xff0c;回首这一年多的历程&#xff0c;也是有一些经验想和大家分享一下。 首先说一下个人情况&#xff0c;本科211&#xff0c;初试成绩400分。专业课140。 整体时间安排 对于考研&#xff0c;很重要的一环就是时间安排&…...

软件测试学习笔记-测试用例的编写

7中测试分类 按照阶段可划分单元测试、集成测试、系统测试、验收测试。代码可见度划分黑盒测试、灰盒测试、白盒测试 单元测试&#xff1a;针对源代码的测试 集成测试&#xff1a;针对接口进行测试 系统测试&#xff1a;针对功能和非功能的测试 验收测试&#xff1a;公测、内测…...

MongoDB学习和应用(高效的非关系型数据库)

一丶 MongoDB简介 对于社交类软件的功能&#xff0c;我们需要对它的功能特点进行分析&#xff1a; 数据量会随着用户数增大而增大读多写少价值较低非好友看不到其动态信息地理位置的查询… 针对以上特点进行分析各大存储工具&#xff1a; mysql&#xff1a;关系型数据库&am…...

mongodb源码分析session执行handleRequest命令find过程

mongo/transport/service_state_machine.cpp已经分析startSession创建ASIOSession过程&#xff0c;并且验证connection是否超过限制ASIOSession和connection是循环接受客户端命令&#xff0c;把数据流转换成Message&#xff0c;状态转变流程是&#xff1a;State::Created 》 St…...

Spring Boot+Neo4j知识图谱实战:3步搭建智能关系网络!

一、引言 在数据驱动的背景下&#xff0c;知识图谱凭借其高效的信息组织能力&#xff0c;正逐步成为各行业应用的关键技术。本文聚焦 Spring Boot与Neo4j图数据库的技术结合&#xff0c;探讨知识图谱开发的实现细节&#xff0c;帮助读者掌握该技术栈在实际项目中的落地方法。 …...

Python如何给视频添加音频和字幕

在Python中&#xff0c;给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加&#xff0c;包括必要的代码示例和详细解释。 环境准备 在开始之前&#xff0c;需要安装以下Python库&#xff1a;…...

pikachu靶场通关笔记22-1 SQL注入05-1-insert注入(报错法)

目录 一、SQL注入 二、insert注入 三、报错型注入 四、updatexml函数 五、源码审计 六、insert渗透实战 1、渗透准备 2、获取数据库名database 3、获取表名table 4、获取列名column 5、获取字段 本系列为通过《pikachu靶场通关笔记》的SQL注入关卡(共10关&#xff0…...

深度学习水论文:mamba+图像增强

&#x1f9c0;当前视觉领域对高效长序列建模需求激增&#xff0c;对Mamba图像增强这方向的研究自然也逐渐火热。原因在于其高效长程建模&#xff0c;以及动态计算优势&#xff0c;在图像质量提升和细节恢复方面有难以替代的作用。 &#x1f9c0;因此短时间内&#xff0c;就有不…...

【Elasticsearch】Elasticsearch 在大数据生态圈的地位 实践经验

Elasticsearch 在大数据生态圈的地位 & 实践经验 1.Elasticsearch 的优势1.1 Elasticsearch 解决的核心问题1.1.1 传统方案的短板1.1.2 Elasticsearch 的解决方案 1.2 与大数据组件的对比优势1.3 关键优势技术支撑1.4 Elasticsearch 的竞品1.4.1 全文搜索领域1.4.2 日志分析…...

【SpringBoot自动化部署】

SpringBoot自动化部署方法 使用Jenkins进行持续集成与部署 Jenkins是最常用的自动化部署工具之一&#xff0c;能够实现代码拉取、构建、测试和部署的全流程自动化。 配置Jenkins任务时&#xff0c;需要添加Git仓库地址和凭证&#xff0c;设置构建触发器&#xff08;如GitHub…...

在golang中如何将已安装的依赖降级处理,比如:将 go-ansible/v2@v2.2.0 更换为 go-ansible/@v1.1.7

在 Go 项目中降级 go-ansible 从 v2.2.0 到 v1.1.7 具体步骤&#xff1a; 第一步&#xff1a; 修改 go.mod 文件 // 原 v2 版本声明 require github.com/apenella/go-ansible/v2 v2.2.0 替换为&#xff1a; // 改为 v…...

React从基础入门到高级实战:React 实战项目 - 项目五:微前端与模块化架构

React 实战项目&#xff1a;微前端与模块化架构 欢迎来到 React 开发教程专栏 的第 30 篇&#xff01;在前 29 篇文章中&#xff0c;我们从 React 的基础概念逐步深入到高级技巧&#xff0c;涵盖了组件设计、状态管理、路由配置、性能优化和企业级应用等核心内容。这一次&…...