微信小程序 上传图片

Posted 2021-02-08 阿政kris*

效果图  如上，js  如下，在页面循环图片就可以

  /**
   * 选择图片
   */
  uploadImgAdd: function(e) {
    var imgs = this.data.imgs;
    wx.chooseImage({
      sizeType: [\'original\', \'compressed\'],
      sourceType: [\'album\', \'camera\'],
      success: (res) => {
        for (let j in res.tempFilePaths){
          if (res.tempFilePaths[j].substring(res.tempFilePaths[j].length - 3)  == \'gif\'){
            wx.showToast({
              title: \'暂不能上传动图哦，换张图片试试吧~\',
              icon: \'none\',
              duration: 2000,
              mask: true,
            })
            res.tempFilePaths.splice(j, 1)
          }
        }
        let tempFilePaths = this.data.tempFilePaths.concat(res.tempFilePaths);
        this.setData({
          tempFilePaths: tempFilePaths
        })
        let uploadimagsSrc = []
        for (var i = 0; i < tempFilePaths.length; i++) {   //转换为七牛地址
          if (imgs.length >= 9) {
            return false;
          } else {
            wx.uploadFile({
              url: app.data.urls + \'images/Picture\',
              filePath: tempFilePaths[i],
              header: {
                \'content-type\': \'multipart/form-data\'
              },
              name: \'file\',
              success: res => {
                let data = res.data;
                console.log(res)
                uploadimagsSrc = [...uploadimagsSrc, data];
                this.setData({
                  uploadimagsSrc: uploadimagsSrc
                })
              },
              fail: (res) => {
                console.log(res)
                if (res.errMsg == "uploadFile:fail Broken pipe"){
                  
                }
              }
            })
          }
        }
      },fail:(res)=>{
        console.log(res)
      }
    })
  },


  /**
   * 删除图片
   */
  uploadImgClose: function(e) {
    var imgs = this.data.tempFilePaths;
    var index = e.currentTarget.dataset.index;
    imgs.splice(index, 1);
    this.setData({
      tempFilePaths: imgs,
      uploadimagsSrc: imgs
    });
  },

/pulishComment/pulishComment