小程序多图上传
wxml
<view class="images" bindtap="upload"> <image src="../../images/icon_shangchuan.png"></image> <text>添加图片</text> </view>
wxss
.images{ width: 134rpx; height: 134rpx; border:1px dashed #D8D8D8; display: flex; flex-direction: column; justify-content: center; align-items: center; } .container .images image{ width: 60rpx; height: 60rpx; }
wx.js
upload: function (e) { var that = this; // 上传图片的提示 if (that.data.uploaderNum >= 10) return wx.showToast({ title: "最多只能上传" + '10' + "张图", duration: 2500, icon: "none" }), !1; //选择图片 wx.chooseImage({ count: 10 - that.data.uploaderNum, // 默认10 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有 success: function (res) { // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片 that.data.uploaderList.concat(res.tempFilePaths); var uploaderList = res.tempFilePaths; that.setData({ uploaderList: that.data.uploaderList.concat(res.tempFilePaths), }) that.setData({ uploaderNum: that.data.uploaderList.length }) for (var i = 0; i < uploaderList.length; i++) { wx.uploadFile({ url: getApp().globalData.url+'/api/upload/upload', filePath: uploaderList[i], name: 'file', // 需要传的参数 formData: { 'user': 'test' }, success: function (res) { that.setData({ tu:that.data.tu.concat(getApp().globalData.url + "/" + JSON.parse(res.data).data.path) }) } }) } } }) },