您好,登錄后才能下訂單哦!
今天就跟大家聊聊有關(guān)怎么在微信小程序中同時(shí)上傳多張圖片,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結(jié)了以下內(nèi)容,希望大家根據(jù)這篇文章可以有所收獲。
1.圖片選擇后,路徑已經(jīng)存入list中:
data: { images: [], //選擇的圖片 },
2.調(diào)用遞歸上傳的方法:
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; //總共上傳的數(shù)量 var count = 0; //第幾張,初始化為0 var url = serverUrl + '/secondHand/uploadImg?id=' + secondHandId; //上傳的接口 //調(diào)用上傳圖片的公共函數(shù) that.uploadOneByOne(url, that.data.images, successUp, failUp, count, length); }, });
3.遞歸上傳方法:
/** * 上傳圖片:遞歸的方式上傳 * url:上傳地址 * imgPaths:上傳的圖片列表 * successUp:上傳成功的個(gè)數(shù),初始化為0 * failUp:上傳失敗的個(gè)數(shù),初始化為0 * count:第幾張 * length:圖片列表的長(zhǎng)度 */ uploadOneByOne(url, imgPaths, successUp, failUp, count, length) { var that = this; wx.uploadFile({ url: url, //上傳地址地址 filePath: imgPaths[count], name: "file", //后臺(tái)接收的文件名 success: function(e) { successUp++; //成功+1 }, fail: function(e) { failUp++; //失敗+1 }, complete: function(e) { count++; //下一張 if (count == length) { TODO: 上傳完畢后跳轉(zhuǎn)頁面 wx.showToast({ title: '發(fā)布成功', icon: 'success', duration: 2000 }) } else { //遞歸調(diào)用,上傳下一張 that.uploadOneByOne(url, imgPaths, successUp, failUp, count, length); } } }) },
4.后臺(tái)接口:
@PostMapping("/uploadImg") public String addSecondHandImg(String id, @RequestParam("file") MultipartFile[] files) { //該接口被多次調(diào)用,這里寫自己的業(yè)務(wù),省略。。。 return ""; }
看完上述內(nèi)容,你們對(duì)怎么在微信小程序中同時(shí)上傳多張圖片有進(jìn)一步的了解嗎?如果還想了解更多知識(shí)或者相關(guān)內(nèi)容,請(qǐng)關(guān)注億速云行業(yè)資訊頻道,感謝大家的支持。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。