使用xlsx解析表格

虽然有时候是前端传给后端一个文件吗，后端返回构造好的数据。但是也经常遇到，要求前端来进行解析，那有什么办法，还是要惯着噻。文章有不妥之处，欢迎大佬指教(´▽ʃ♡ƪ) 在使用之前还是建议小伙伴们先阅读一个npm上的介绍[ 传送门 ](https://www.npmjs.com/package/xlsx) 代码如下（写的react，原生js同理）`

// 导入
import XLSX from "xlsx";

按钮

<input
  type="file"
  onChange={(event) => {
    this.importData(event);
  }}
/>

点击按钮逻辑

importData = (e) => {
    // 获取excel 文件参数（files）
    let workbook,
      tableList = [];
    let files = e.target.files[0];
    let suffix = e.target.files[0].name.split(".")[1];
    // 判断文件类型是不是xlsx 格式
    if (suffix != "xls" && suffix != "xlsx") {
      return message.warning("文件类型不正确");
    }
    // 定义FileReader对象
    let reader = new FileReader();
    //  文件读取成功完成时触发
    reader.onload = (ev) => {
      // 文件里的文本会在这里被打印出来
      try {
        let data = ev.target.result;
        workbook = XLSX.read(data, { type: "binary" }); // 以二进制流方式读取得到整份excel表格对象
      } catch (e) {
        console.log(e);
        message.warning("文件类型不正确");
        return;
      }
      // 表格的表格范围，可用于判断表头是否数量是否正确
      let fromTo = "";
      // 遍历每张表读取
      for (let sheet in workbook.Sheets) {
        if (workbook.Sheets.hasOwnProperty(sheet)) {
          fromTo = workbook.Sheets[sheet]["!ref"];
          let obj = {};
          obj[sheet] = XLSX.utils.sheet_to_json(workbook.Sheets[sheet]);
          tableList.push(obj);
          // break; // 如果只取第一张表则加上
        }
      }
      // 把获取的表格数据进行赋值
      console.log("获取到的表格数据----", workbook, tableList);
      //  显示弹窗
      // this.showfile = true;
    };
    // 以二进制方式打开文件
    reader.readAsBinaryString(files);
  };