小程序多图上传

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

  

  

posted @ 2020-07-14 18:06  野鹤亦闲云  阅读(164)  评论(0编辑  收藏  举报