文件格式转换

把我的悲惨故事说给大家乐呵乐呵：老板让运营把一些数据以json格式给我，当我看到运营在石墨文档上编辑的时候我人都傻了，我理解运营的艰难，可我也是真的难啊，在石墨文档编辑的眼花缭乱的，很多属性都错乱了(诸如把名字赋值给了爱好)。挨个调整半天，这种经历我可不想再来一次，考虑到后续还会使用，我决定写个工具给运营。

知识点：利用xlsx 对文件做格式转换

• 在 React 中将 JSON 转换为 Excel 可以使用类似 js-xlsx 的库。
• js-xlsx 是一个功能强大的 JavaScript 库，可以读写各种类型的表格，包括 Excel。

将XLSX转换成JSON格式

import * as XLSX from 'xlsx/xlsx.mjs';
import FileSaver from 'file-saver';


  function change_XLSX_TO_JSON(e) {
    // 获取上传的文件对象
    const { files } = e.target;
    // 通过FileReader对象读取文件
    const fileReader = new FileReader();
    fileReader.onload = (event) => {
      try {
        const { result } = event.target;
        // 以二进制流方式读取得到整份excel表格对象
        const workbook = XLSX.read(result, { type: "binary" });
        let data = []; // 存储获取到的数据
        // 遍历每张工作表进行读取（这里默认只读取第一张表）
        for (const sheet in workbook.Sheets) {
          if (workbook.Sheets.hasOwnProperty(sheet)) {
            // 利用 sheet_to_json 方法将 excel 转成 json 数据
            data = data.concat(
              XLSX.utils.sheet_to_json(workbook.Sheets[sheet])
            );
            // break; // 如果只取第一张表，就取消注释这行
          }
        }
        console.log(data);
        //将json转成blob,存入本地
        const blob = new Blob([JSON.stringify(data)], {
          type: "text/xlsx;charset=utf-8",
        });
        FileSaver.saveAs(blob, "data.js");
      } catch (e) {
        // 这里可以抛出文件类型错误不正确的相关提示
        console.log("文件类型不正确");
        return;
      }
    };
    // 以二进制方式打开文件
    fileReader.readAsBinaryString(files[0]);
    //清空input的值
    e.target.value = "";
  }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

将JSON转换成XLSX格式

  //读取upload 的 json 文件的内容
  function change_JSON_XLSX(e) {
    const { files } = e.target;

    const fileReader = new FileReader();
    fileReader.readAsText(files[0], "UTF-8"); //读取文件
    fileReader.onload = function (evt) {
      //读取完文件之后会回来这里
      var fileString = evt.target.result; // 读取文件内容
      const ws = XLSX.utils.json_to_sheet(JSON.parse(fileString));
      const wb = XLSX.utils.book_new();
      XLSX.utils.book_append_sheet(wb, ws, "Sheet1");
      XLSX.writeFile(wb, "data.xlsx");
    };

    //情况input的值
    e.target.value = "";
  }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18