根据实际项目需求,需要前端去解析Excel文件成json格式传给后端
这时候我就想到了xlsx包,有直接转化为json的方法
说干就干
1.安装和引入相关包
(jquery好像是xlsx需要安装的依赖)
"jquery": "^3.5.1","xlsx": "^0.16.8"
然后npm install一下
2.在vue文件中引入
import XLSX from "xlsx";
3.准备一个解析的excel文件,开始前端接入
<div class="importdata-title">上传文件:</div><div class="importdata-box"><inputtype="file"ref="upload"accept=".xls, .xlsx"class="outputlist_upload"style="width:100px;"@change="readExcel"/></div>
js方法:
readExcel(e) {//表格导入const files = e.target.files;const fileReader = new FileReader();fileReader.onload = ev => {try {const data = ev.target.result;const workbook = XLSX.read(data, {type: "binary"});const wsname = workbook.SheetNames[0]; //取第一张表console.log(workbook)const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]); //生成json表格内容this.toJson = ws// 转化成功的json} catch (e) {return false;}};fileReader.readAsBinaryString(files[0]);},