本文實例為大家分享了微信小程序實現同時上傳多張圖片的具體代碼，供大家參考，具體內容如下

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 "";}

文章參考：微信小程序實現上傳多個文件 超過10個

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持錯新站長站。