1.设置一个input的change事件，把参数填进去，需要用到
<input type="file" accept=".xls,.xlsx" 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，把需要上传的文件地址放进去即可
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; } };
