实现文件的选择,判定
首先是upload模板
<el-upload
ref="upload"
:limit="1"
:before-upload="beforeUpload"
:auto-upload="false"
:headers="headers"
:on-success="handleSuccess"
:on-error="handleError"
accept=".xlsx, .xls"
:action="fileUploadApi + '?name=' + name" >
<div class="title">请上传需要导入分配的设备实例数据</div>
</el-upload>
需要在data中定义neme
name: "",
然后是调用方法
methods: {
// 上传文件,点击事件
upload() {
this.$refs.upload.submit();
},
beforeUpload(file) {
console.log(file);
let isLt2M = true;
isLt2M = file.size / 1024 / 1024 < 100;
//判断类型
if (!this.isExcel(file)) {
this.$message.error("只支持.xlsx, .xls, .csv 格式文件");
return false;
}
//判断上传文件大小
if (!isLt2M) {
console.log("cuo");
this.loading = false;
this.$message.error("上传文件大小不能超过 100MB!");
}
this.name = file.name;
return isLt2M;
},
//正则判断上传文件类型
isExcel(file) {
return /\.(xlsx|xls|csv)$/.test(file.name);
},
handleSuccess(response, file, fileList) {
this.$message({
message: '文件上传成功',
type: 'success'
});
this.$refs.upload.clearFiles();
},
// 监听上传失败
handleError(e, file, fileList) {
const msg = JSON.parse(e.message);
this.$notify({
title: msg.message,
type: "error",
duration: 2500,
});
},
}