elementui中同时上传多个文件_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)   }) },