el-upload组件采坑

在使用Upload这个组件的时候，我们会发现它其实有许多的小坑坑

1.在发送post请求时，由于项目中写了拦截器和全局配置，所以需要针对上传文件接口单独配置请求头和数据整理(qs)，

上传文件的formdata不要使用Qs.stringify(config.data)整理，否则后台拿不到文件数据，具体配置请看vue axios封装http拦截和公用请求

 config.headers = {

        'Content-Type': 'multipart/form-data'

 }

后面就是需要后台支持了，让他们用MultipartFile接收就行

2.当文件上传失败的时候，会调用before-remove / on-remove钩子。

根据fileUploadRemove方法，file是上传失败的文件B的信息，此时this.fileList（保存上传成功的文件）中并没有保存文件B，因此findIndex会返回-1，导致最后会删除this.fileList数组中的最后一个数据项。

因此，在执行删除操作的时候，需要添加一些判断，确认文件是否需要被删除。

修改后的代码如下：

beforeRemove(file,fileList){

      if(file && file.status === 'success'){

        //todo需要处理的事项

      }

},

3.删除文件会触发俩个钩子before-remove / on-remove钩子

handleRemove(file,fileList){

     // todo清除文件数据的操作

      this.clearImportData()

 },

 beforeRemove(file,fileList){

      if(file && file.status === 'success'){

        return this.$confirm(`确定移除${file.name}？`)

      }

 },