vue实战(14)——基于Element图片批量上传

1、运用场景

image.png

                建议尺寸: 750 * 500
            
              
            
            
              
            
          
// 主相册
      handlePictureCardSuccess (response, file) {
        // console.log执行了三次
        if(response.code == 1) {
        this.picAddressList.push({
          "url": global.imgPath + response.data.url
        })
          this.formData.picAddressList.push(response.data.url)
        }
        // console.log执行了一次
      },

• 原本单图上传的配置上加了multiple属性，选择3个图片文件后，一次性请求了3次接口，图片却只增加了一张，中间出现了三张闪一下又只剩一张了
• 排查代码是this.picAddressList.push的过程中只执行了最后一次push，进一步改造上传push处理应该能解决
• 翻阅了Element的上传api，找到了多图上传的相应方法，需要后端配合提供一个多图上传的接口

2、实现代码