1，先设置一下input，在change事件传一个参数
<input type="file" accept=".xls,.xlsx" class="file-btn" required @change="changeExcel($event)" />
2，在事件内获取到文件，通过length进行为空判断，我这里限制的是excel文件
const files = ev.target.files; console.log(files); if (files.length < 0) { console.log('没有上传'); return false; } else if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) { ElMessage.warning('您上传的文件格式不正确'); return false;
3，最后通过判断了就开始使用Form Data进行上传文件
let param = new FormData(); //创建form对象 param.append('file', files[0], files[0].name); //通过append向form对象添加数据 fileParam.value = param; Filename.value = files[0].name;
4，最后在请求接口处把这个文件放上去
axios({ url: '上传文件的接口地址', method: 'POST', data: fileParam.value, })
最后附上事件的完整代码
const changeExcel = (ev) => { const files = ev.target.files; console.log(files); if (files.length < 0) { console.log('没有上传'); return false; } else if (!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())) { ElMessage.warning('您上传的文件格式不正确'); return false; } else { let param = new FormData(); //创建form对象 param.append('file', files[0], files[0].name); //通过append向form对象添加数据 fileParam.value = param; Filename.value = files[0].name; } };
