痛点：在录入数据时，靠人工将excel表格的内容复制到网页上，耗费人力及时间成本，且长时间操作后，准确率得不到保障。
需求：在网页将Excel导入后，表格字段自动填充到网页的对应位置。
本文将着重介绍Excel文件导入及将导入数据转换为json格式。
直接先上效果图：
Excel.png
excel处理过的json对象.png
该功能使用原生js即可完成，趁着热乎来记录一下。需要用到xlsx.full.min.js，下载地址：https://www.cdnpkg.com/xlsx/file/xlsx.full.min.js/?id=78603
1、下载完成后，页面引用；
<script src="js/xlsx.full.min.js"></script>
2、html代码
<input type="file" onchange="impexcel(this)" />
3、js核心代码；
// 导入excel
function impexcel(obj) {
var wb; // 存放解析后的excel数据
if(!obj.files) {
return;
}
var f = obj.files[0];
var reader = new FileReader();
reader.onload = function(e) {
var data = e.target.result;
//将文件读取为二进制字符串
wb = XLSX.read(data, {
type: 'binary'
});
// wb.SheetNames[0]是获取第一个Sheet页的名字
console.log('sheet页名称：',wb.SheetNames[0]);
// wb.Sheets[Sheet名]：获取对应Sheet页的数据
var dataArr = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
console.log('当前sheet页数据：',dataArr);
dataArr.forEach((item,index)=>{
console.log(`第${index+1}行数据:`,item)
})
};
reader.readAsBinaryString(f);
}
此时，我们已经拿到了想要的json数据格式，可以对网页进行数据渲染。之后的操作各有不同，就不继续往下写了，根据自己的需求处理即可。
至此，功能实现，特此记录！
