在使用 Element UI 的 el-upload 组件时，默认情况下每次选择文件都会触发一次上传请求。如果你需要一次性上传多个文件，而不是每个文件都触发一次请求，可以通过一些配置和代码处理来实现。
方法一：通过配置file-list（推荐使用）
html部分：
<el-uploadclass="upload-demo list-uploadbtn"ref="upload":action="curBastUrl":auto-upload="false":on-remove="updataRemove":before-upload="beforeUpload":on-change="updatachange":file-list="fileList":multiple="true"><el-button size="small">点击上传</el-button>
</el-upload>
<el-button type="primary" @click="submitUpload">确 定</el-button>
js部分：
submitUpload() { // 导入let formData = new FormData(); // 用FormData存放上传文件this.fileList.forEach(file => { formData.append('file', file.raw) }) formData.append('categoryDirectory', this.filedata.categoryDirectory)// importCase是上传接口importCase(formData).then((res) => { //手动上传无法触发成功或失败的钩子函数，因此这里手动调用 this.updataSuccess(res.data) }, (err) => {})
}
方法二：通过配置http-request
html部分：
<el-uploadclass="upload-demo list-uploadbtn"ref="upload":action="curBastUrl":auto-upload="false":http-request="uploadFile":on-remove="updataRemove":before-upload="beforeUpload":on-change="updatachange":multiple="true"><el-button size="small">点击上传</el-button>
</el-upload>
<el-button type="primary" @click="submitUpload">确 定</el-button>
js部分：
submitUpload() { // 导入let tempData = this.filedatathis.filedata = new FormData() // 用FormData存放上传文件this.$refs.upload.submit() // 会循环调用uploadFile方法，多个文件调用多次this.filedata.append('categoryDirectory', tempData.categoryDirectory)// importCase是上传接口importCase(this.filedata).then((res) => { //手动上传无法触发成功或失败的钩子函数，因此这里手动调用 this.updataSuccess(res.data) }, (err) => {})
}
uploadFile(file) {this.filedata.append('file', file.file)
}