关于微信小程序的图片上传问题

咱们公司使用的mpvue开发小程序,我在作商品评价这一块的上传图片时遇到一些问题,由于小程序的图片是单张上传的,所以我用了for循环将多张图片循环上传,我用了两个数组,一个数组放的是图片的如今的地址用于显示在页面,一个数据放的是上传图片至服务器后返回的图片地址,用于传递给后端,可是我发现并非循环一次就执行一遍上传操做,而是for循环差很少先执行完,才开始执行上传操做,这就致使服务器返回的图片的顺序与数组中的顺序不同,当我删除了数组中某个位置的地址,而后再将这张图片上传,服务器是根据个人前一个数据的位置返回的,好比删除了第三张,可是服务器返回的这个第三张的地址多是第二个返回的,而后你在上传,服务器仍是给你返回第二个,就致使了图片重复,总而言之就是不能用for循环上传,那用什么呢?用递归,附上代码vue

// 上传图片
    clickChooseImg() {
      let that = this;
      const s = 0;
      wx.chooseImage({
        count: 4,
        sizeType: ["original", "compressed"],
        sourceType: ["camera",'album'],
        success: function(res) {
          let tempFilePaths = res.tempFilePaths;
          if (tempFilePaths.length != 0) {
            for (let s = 0; s < tempFilePaths.length; s++) {
              that.imageList.push(tempFilePaths[s]);
            };
            that.reqUpload(tempFilePaths, s , tempFilePaths.length);
          }
        }
      })
    },
    // 上传图片至七牛
    reqUpload(tempFilePaths, s , len) {
      let that = this
      wx.uploadFile({
        url: "xxxxxxxxxxxxxxxxxxxxxxx",
        filePath: tempFilePaths[s],
        name: "file",
        formData: {
          token: that.token
        },
        success: function(res) {
          that.onlineImageList.push(that.addressPrefix + JSON.parse(res.data).key);
        },
        complete: function(){
          s++;
          if(s < len){
            that.reqUpload(tempFilePaths,s,len);
          }
        }
      })
    },
相关文章
相关标签/搜索