前端
<avue-form v-model="uploadForm" :option="uploadOption" @submit="handleUpload">
<template slot="file">
<el-upload
action="#"
:auto-upload="false"
accept='application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
:multiple="false"
:on-exceed="() => this.$message.error('只能选择一个文件')"
:on-change="(file)=>{this.uploadForm.file=file}"
:limit="1">
<el-button
slot="trigger"
type="primary">选取文件
</el-button>
<div slot="tip" class="el-upload__tip">只能上传xls/xlsx文件,且不超过100Mb</div>
</el-upload>
</template>
</avue-form>
....
methods:{
handleUpload() {
this.loading = true
const data= new FormData()
data.append('file', this.form.files[0].raw)
data.set('param', JSON.stringify(this.form))
axios.post('/import',data).then(res => {
console.log('------- end uplaod>>>', res)
this.loading = false
}).catch(err => {
console.error(err)
this.loading = false
})
},
}
后端
@PostMapping("/import")
@ResponseBody
public void importData(@RequestPart("file") MultipartFile file,Map param) throws IOException {
}