怎么在微信小程序中同时上传多张图片

今天就跟大家聊聊有关怎么在微信小程序中同时上传多张图片，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

站在用户的角度思考问题，与客户深入沟通，找到恒山网站设计与恒山网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：做网站、成都做网站、企业官网、英文网站、手机端网站、网站推广、域名与空间、雅安服务器托管、企业邮箱。业务覆盖恒山地区。

1.图片选择后，路径已经存入list中：

data: { 
 images: [], //选择的图片 
 },

2.调用递归上传的方法：

wx.chooseImage({
 var that = this
 count: 9,
 sizeType: ['original', 'compressed'],
 sourceType: ['album', 'camera'],
 success: function(res){ 
 var successUp = 0; //成功，初始化为0
 var failUp = 0; //失败，初始化为0
 var length = that.data.images.length; //总共上传的数量
 var count = 0; //第几张，初始化为0
 var url = serverUrl + '/secondHand/uploadImg?id=' + secondHandId; //上传的接口
 //调用上传图片的公共函数
 that.uploadOneByOne(url, that.data.images, successUp, failUp, count, length);
 }, 
 });

3.递归上传方法：

/**
 * 上传图片：递归的方式上传
 * url:上传地址
 * imgPaths：上传的图片列表
 * successUp：上传成功的个数，初始化为0
 * failUp：上传失败的个数，初始化为0
 * count：第几张
 * length：图片列表的长度
 */
 uploadOneByOne(url, imgPaths, successUp, failUp, count, length) {
 var that = this;
 wx.uploadFile({
 url: url, //上传地址地址
 filePath: imgPaths[count],
 name: "file", //后台接收的文件名
 success: function(e) {
 successUp++; //成功+1
 },
 fail: function(e) {
 failUp++; //失败+1
 },
 complete: function(e) {
 count++; //下一张
 if (count == length) {
 TODO: 上传完毕后跳转页面
 wx.showToast({
 title: '发布成功',
 icon: 'success',
 duration: 2000
 })
 }
 else {
 //递归调用，上传下一张
 that.uploadOneByOne(url, imgPaths, successUp, failUp, count, length);
 }
 }
 })
 },

4.后台接口：

@PostMapping("/uploadImg")
public String addSecondHandImg(String id, @RequestParam("file") MultipartFile[] files) {
 //该接口被多次调用，这里写自己的业务，省略。。。
 return "";
}

看完上述内容，你们对怎么在微信小程序中同时上传多张图片有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注创新互联行业资讯频道，感谢大家的支持。

当前名称：怎么在微信小程序中同时上传多张图片
文章路径：https://www.cdcxhl.com/article44/ghpcee.html

成都网站建设公司_创新互联，为您提供用户体验、ChatGPT、网站设计公司、搜索引擎优化、网站排名、移动网站建设

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联