vue 批量导入 + 过滤excel文件(用了el-upload),处理上传的excel
vue 批量导入 + 过滤excel文件(用了el-upload)
2020-12-18 11:59:02完整代码(这做成了一个子组件)
>
>
ref="upload" action="/" :on-change="handleChange" :onexceed="handleExceed" :show-file-list="false"
:auto-upload="false">
type="success" class="excel-btn">Excel导入 >
>
>
>
<script>
import XLSX from 'xlsx'
export default {
data(){
return{
dataList:[]
}
},
methods:{
//上传文件时处理方法
handleChange(file, fileList) {
// let file = file.files[0] // 使用传统的input方法需要加上这一步
let self = this;
const types = file.name.split(".")[1];
const fileType = ["xlsx", "xlc", "xlm", "xls", "xlt", "xlw", "csv"].some(
item => item === types
);
this.fileTemp = file.raw;
if (this.fileTemp) {
if ((types == 'xlsx') || (types == 'xlc') || (types == 'xlm') || (types == 'xls') || (types == 'xlt') || (types ==
'xlw') || (types == 'csv')) {
this.importfxx(types);
} else {
this.$message({
type: 'warning',
message: '附件格式错误,请删除后重新上传!'
})
}
} else {
this.$message({
type: 'warning',
message: '请上传附件!'
})
}
},
//超出最大上传文件数量时的处理方法
handleExceed() {
this.$message({
type: 'warning',
message: '超出最大上传文件数量的限制!'
})
return;
},
importfxx(obj) {
let _this = this;
let inputDOM = this.$refs.inputer;
// 通过DOM取文件数据
this.file = event.currentTarget.files[0];
var rABS = false; //是否将文件读取为二进制字符串
var f = this.file;
var reader = new FileReader();
FileReader.prototype.readAsBinaryString = function(f) {
var binary = "";
var rABS = false; //是否将文件读取为二进制字符串
var pt = this