axios+java多文件上传

本文均为简单示例代码，仅为 多文件 上传提供思路，和前端传参、后端接收参数，并非完整上传demo

如果误导了大家，请见谅

前端

html

<el-button type="primary" @click="startSelectFile">点我开始上传</el-button>
<!-- 隐藏的上传 input                                                                              -->
<input type="file" multiple="multiple" size="200" v-show="false" ref="uploadFileInputRef" @change="selectedFile">

js

// 点击按钮开始选择文件
startSelectFile(){
    this.$refs.uploadFileInputRef.click();
},
// input文件域的 change事件
selectedFile(e) {
  this.uploadFile("/test/upload", e.target.files).then((res) => {
    console.log(res);
  });
},
// 使用 axions 封装一个多文件上传方法（正常来说，这个应该会封装在一个全局的js中，供所有页面使用，此处为方便理解，直接写在页面的 methods 中）
uploadList (path, data) {
    var formData = new FormData();
    if (data && data.length) {
        data.forEach(item => {
            formData.append("files", item)
        })
        return new Promise(function (resolve) {
            axios
                .post(path, formData, {
                    headers: {
                        'Content-Type': "multipart/form-data",
                    }
                })
                .then(function (response) {
                    resolve(response.data);
                })
        });
    }
}

java后端

@PostMapping("/upload")
public String upload(@RequestParam("files") MultipartFile[] files){
    for(MultipartFile file : files){
        System.out.println(file.getOriginalFilename());
    }
    return "上传成功";
}