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

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,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,length);
 }
 }
 })
 },

4.後臺介面：

@PostMapping("/uploadImg")
public String addSecondHandImg(String id,@RequestParam("file") MultipartFile[] files) {
 //該介面被多次呼叫，這裡寫自己的業務，省略。。。
 return "";
}

文章參考：微信小程式實現上傳多個檔案 超過10個

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。