vue+elementUl导入文件方式(判断文件格式)_vue.js_

stringObject.substring(start,stop)

 导入教师 下载模板
选择文件

 data() { return { uploadFile: {}, //拼接导入文件参数 tableData: [], // 页面table显示的数据 }; },

 // 下载模版 modelDown() { window.open( "https://linkjoint-star.oss-cn-hongkong.aliyuncs.com/excel-template/教师导入模板.xlsx" ); }, // 提取文件后缀名 getSuffix(str) { const fileExtension = str.substring(str.lastIndexOf(".") + 1); return fileExtension; }, //导入前判断 beforeUpload(file) { let suffix = this.getSuffix(file.name); if (suffix !== "xlsx") { this.$message.error("文件格式只能是.xlsx"); return false; } }, //导入完成后提示 uploadSuccess(res, file) { console.log("res", res); if (res.status_code == 200) { if (res.data.status == 200) { this.$message({ message: `${res.data.msg}`, type: "success" }); this.getData(); } else { this.$message({ message: `${res.data.msg}`, type: "warning" }); } } else { this.$message.error("服务器错误"); } this.$refs.upload.clearFiles(); }, //导入错误提示 uploadError(err, file) { let error = JSON.parse(err.message); console.log(file); if (error.status_code == 422) { this.$message.error(error.message); } this.$refs.upload.clearFiles(); },

导出模板

 downloadTemplate() {       exportTemplate()         .then(res => {           if (!res) {             return;           }           // 兼容IE浏览器           if (window.navigator && window.navigator.msSaveOrOpenBlob) {             window.navigator.msSaveOrOpenBlob(               new Blob([res.data]),               `文件名称.xlsx`             );           } else {             let url = window.URL.createObjectURL(new Blob([res.data])); //取到url。创建一个 DOMString，其中包含一个表示参数中给出的对象res的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。             let link = document.createElement("a"); //触发鼠标事件对象             link.style.display = "none"; //清除a标签样式             link.href = url; //设置下载地址             link.setAttribute("download", `文件名称.xlsx`); //给a标签添加download属性，并为其赋值             document.body.appendChild(link); //向节点添加一个子节点             link.click(); //执行click事件           }         })         .catch(error => {         });     },

    导入

import XLSX from "xlsx";

// 读取excel     readExcel(file) {       var reader = new FileReader(); //启动读取指定的File 内容       reader.readAsArrayBuffer(file.raw); //当读取操作完成时,会触发一个 load 事件,从而可以使用 reader.onload 属性对该事件进行处理。       reader.onload = e => {        //获取文件数据         const data = e.target.result; //XLSX读取文件         const wb = XLSX.read(data, { type: "array" });  //获取第一张表         const wsname = wb.SheetNames[0];         const ws = wb.Sheets[wsname];         var result = XLSX.utils.sheet_to_json(ws, { header: 1 });         this.$refs.upload.clearFiles(); //清除当前 files         if (result.length < 2503) {           this.dataDetail(result);         } else {           this.$message("每次导入数据最多2500条");         }         return result;       };     },

 //通过接口把读出来的result传给后台 dataDetail(result) { //result内容格式的校验、必填项的校验   importReord(result)         .then(res => {             this.getRecordList();             if (res.data.msg == "批量新增成功") {               this.$message({                 message: "数据导入成功",                 type: "success"               });             }           })        .catch(error => {             if (error.response.status == 403) {               this.$message.error("无操作权限");             } else {               this.$message.error("数据导入失败");             }           }); }

 //校验时间格式     istimeCheck(keyword) {       // let emIP = this.periodCheck.replace(/\s+/g, ""); //循环去空       let emIP = this.periodCheck.replace(/(^\s*)|(\s*$)/g, ""); //去除首尾空格       let timeArray = emIP.split("-"); //把字符串转换为数组       var result = timeArray.map(function(item, index, timeArray) {         // var reg = /^[1-9]\d{3}.(0[1-9]|1[0-2]).(0[1-9][0-1][0-9]|0[1-9]2[0-3]|[1-2][0-9][0-1][0-9]|[1-2][0-9]2[0-3]|3[0-1][0-1][0-9]|3[0-1]2[0-3]):[0-5][0-9]$/;         var reg = /^((([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3}).(((0[13578]|1[02]).(0[1-9]|[12][0-9]|3[01]))|((0[469]|11).(0[1-9]|[12][0-9]|30))|(02.(0[1-9]|[1][0-9]|2[0-8]))))|((([0-9]{2})(0[48]|[2468][048]|[13579][26])|((0[48]|[2468][048]|[3579][26])00)).02.29)) ([0-1][0-9]|2[0-3]):([0-5][0-9])$/;         return reg.test(item);       });       if (result.indexOf(false) > -1) {         return false;       } else {         return true;       }     }

 //校验IP地址格式     isValidIP(keyword) {       let emIP = this.OValidIP.replace(/\s+/g, ""); //字符串去空       if (emIP.indexOf("/") > -1) {         var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\/(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;         return reg.test(emIP);       } else {         var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;         return reg.test(emIP);       }     },