700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > 微信小程序多张图片上传功能的实现

微信小程序多张图片上传功能的实现

时间:2022-05-30 11:49:27

相关推荐

微信小程序多张图片上传功能的实现

微信小程序|小程序开发

微信小程序多张图片上传,微信小程序多图上传,微信小程序图片上传

微信小程序-小程序开发

这篇文章主要为大家详细介绍了微信小程序实现多张图片上传功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

小程序开发平台 源码,Vscode中路径没有提示,ubuntu安装nmon,java中运行tomcat,psn奖杯爬虫,php 响应慢,安阳seo网络推广平台,网站添加微信支付接口,php 开源官网模板lzw

微信小程序上传图片每次只能上传一张,所有很多朋友就会问想要多张图片上传怎么办?

dnf70级旧版辅助源码,vscode获取时间,更改ubuntu的分辨率命令,tomcat静态文件,sqlite存储占用大小,帝国cms7.2分享插件,c 前端ui框架有哪些,笔趣阁的爬虫,php 正则 a,在线seo检测,杰奇小说网站搬家乱码,简单网页登陆界面代码下载,源码模板lzw

首先,我们来看一看wx.chooseImage(object)和wx.uploadFile(OBJECT)这两个个api

订餐单店源码,vscode自动补全符号,ubuntu 汉语 灰色,tomcat总是挂掉,安卓sqlite主键重复,网络爬虫有啥优点和缺点,php 字符拆分,海口seo公司技术,男科医院网站模板,移动端网页代码模板下载不了,软件基本设计模板lzw

示例代码是这样的:

wx.chooseImage({ success: function(res) { var tempFilePaths = res.tempFilePaths wx.uploadFile({ url: http://example./upload, //仅为示例,非真实的接口地址 filePath: tempFilePaths[0], name: file, formData:{ user: est }, success: function(res){ var data = res.data //do something } }) }})

这里的示例代码,是选择图片,然后上传选中的图片中的第一个图片;

现在开始写多张图片上传的例子

首先,我们还是要选择图片

wx.chooseImage({ success: function(res) { var tempFilePaths = res.tempFilePaths;//这里是选好的图片的地址,是一个数组 }})

然后在app.js中写一个多张图片上传的方法,后面引入,你也可以写在一个JS文件中,后面引入:

//多张图片上传 function uploadimg(data){ var that=this, i=data.i?data.i:0, success=data.success?data.success:0, fail=data.fail?data.fail:0; wx.uploadFile({ url: data.url, filePath: data.path[i], name: fileData, formData:null, success: (resp) => { success++; console.log(resp) console.log(i); //这里可能有BUG,失败也会执行这里 }, fail: (res) => { fail++; console.log(fail:+i+"fail:"+fail); }, complete: () => { console.log(i); i++; if(i==data.path.length){ //当图片传完时,停止调用 console.log(执行完毕); console.log(成功:+success+" 失败:"+fail); }else{//若图片还没有传完,则继续调用函数 console.log(i); data.i=i; data.success=success; data.fail=fail; that.uploadimg(data); } } }); }

多张图片上传的方法写好了,下面就是引用:

var app=getApp();Page({ data:{ pics:[] }, choose:function(){//这里是选取图片的方法 var that=this; wx.chooseImage({ count: 9-pic.length, // 最多可以选择的图片张数,默认9 sizeType: [original, compressed], // original 原图,compressed 压缩图,默认二者都有 sourceType: [album, camera], // album 从相册选图,camera 使用相机,默认二者都有 success: function(res){ var imgsrc=res.tempFilePaths; that.setData({ pics:imgsrc }); }, fail: function() { // fail }, complete: function() { // complete } }) }, uploadimg:function(){//这里触发图片上传的方法 var pics=this.data.pics; app.uploadimg({ url:https://........,//这里是你图片上传的接口 path:pics//这里是选取的图片的地址数组 }); }, onLoad:function(options){ }})

完结。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。