Element ui中upload组件一次请求批量上传

Element ui是由饿了么团队推出的基于vue的前端库，功能非常强大，其中的upload组件可以轻松的实现前端通过点击或者拖拽上传文件。不过upload组件默认的批量上传却是逐项上传，也就是你一次批量选择5个文件，那么会发送5次请求来分别上传这5个文件。

那么Element ui中upload组件怎么实现一次请求批量上传呢？这就需要通过自定义http-request来覆盖默认的上传行为，实现自定义上传，具体代码如下：

代码说明：

1.配置自定义的http-request函数：

  :http-request="customUpload"

2.在data中添加一项参数：fileData，类型是FormData:

  fileData: new FormData()

3.实现customUpload方法，将上传文件信息拼接到fileData中。

  customUpload(file) {    this.fileData.append('files[]', file.file)    return false  }

4.定义axios异步上传方法：

  export function fileUpload(file) {    return request({     method: 'post',     url: 'http://localhost/api/import',     headers: {'Content-Type':'multipart/form-data'},     data: file    })    }

5.在submitUpload中调用4中定义的上传方法：

  submitUpload() {    this.$refs.upload.submit();    fileUpload(this.fileData).then(response => {    //console.log(response)    })  },