如何將Excel文件解析為json格式

andycall 發布于2019-08-23 10:56 / 2873人閱讀

摘要：最近工作中遇到一個需求，大致需求就是將文件在導入時解析為格式轉換數據結構再傳輸給后臺。先介紹幾個基本概念對象，指的是整份文檔。對象，指的是文檔中的表。廢話不多說直接上這里演示下網頁中使用共有種讀取方法將文件讀取為。

最近工作中遇到一個需求，大致需求就是將Excel文件在導入時解析為json格式轉換數據結構再傳輸給后臺。這方面的庫比較少，比較主流的是js-xlsx，官網地址為sheetjs官網，但是文檔都寫得不太清楚，坑也比較多，這里我做一個簡單的介紹與運用與避坑指南。

先介紹幾個基本概念：

workbook 對象，指的是整份 Excel 文檔。我們在使用 js-xlsx 讀取 Excel 文檔之后就會獲得 workbook
對象。

worksheet 對象，指的是 Excel 文檔中的表。我們知道一份 Excel 文檔中可以包含很多張表，而每張表對應的就是 worksheet 對象。

廢話不多說直接上這里演示下網頁中使用

這里演示下在react+antd組合下使用

import { Button, Icon } from "antd";
const XLSX = require("XLSX");//必須使用CommonJs規范引入，如果使用import引入則找不到read 方法



  handle_click_send_file = () => {
    this.file_input.click();
  }

  handle_file_change = () => {
    this.asyncReaderFile(this.file_input, XLSX).then((res) => {
      console.log(res); //在回調函數中輸出結果
    });
  }

asyncReaderFile = (event, XLSX) => {
    const files = event.files || [];
    const file = files[0]; //獲取第一個Blob對象
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.readAsBinaryString(file); //readAsBinaryString(file)：將文件讀取為二進制字符串
      reader.onload = function(e) {
        const data = e.target.result;
        //XLSX.read獲得 workbook對象，指的是整份Excel文檔,并將其解析為二進制字符串
        const wb = XLSX.read(data, {
          type: "binary",
        });
        //wb.SheetNames[0]是獲取第一個表名
        //wb.Sheets[表名]獲取第一個表的數據
        //XLSX.utils.sheet_to_json生成一個對象數組，JSON.stringify解析為json對象
        const json = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
        //這里將解析出的json數據轉換下格式
        const resData = json.map((obj) => {
          let words = "";
          for (const i in obj) {
            words += obj[i] + "/";
          }
          return words;
        });
        resolve(resData);
      };
    });
  };

這里主要的一個坑就是不能使用inport 引用！因為這個庫很早之前就做出來了，用的是CommonJs規范，因此不能用import方式引用；另一個需要注意的點是在瀏覽器中需要使用read方式解析出workbook對象，在Node環境中則需要使用readFile解析出workbook對象。

還有很多其他用法，具體的詳情可以看下文檔npm-xlsx

GPU云服務器云服務器 js將數據轉化為json格式 js將數據轉化為json 輸出為json格式將域名解析為ip地址

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/96839.html

[SheetJS] js-xlsx模塊學習指南

摘要：簡介是前端操作以及類似的二維表的最佳選擇之一而是它的社區版本將注意力集中到了數據轉換和導出上所以它支持相當多種類的數據解析和導出不僅僅局限于支持格式支持的導入格式支持的導出格式它可以解析符合格式的數據導出符合格式的數據利用中間層操作數據簡介 SheetJS是前端操作Excel以及類似的二維表的最佳選擇之一,而js-xlsx是它的社區版本. js-xlsx將注意力集中到了數據轉換和導出...

zhaot 2019-08-23 15:05 評論0 收藏0
工作中常用的npm包

摘要：工具類工具庫，封裝了處理，，，等常見的函數，是對標準庫的補充。業務開發中常用的函數有很多，如等。示例如下整數處理保留兩位小數百分比處理億億處理萬萬處理格式化數字大于億的展示為億，大于萬的展示為萬億萬時間處理庫。工具類 lodash 工具庫，封裝了處理arrays，numbers，objects，string等常見的函數，是對標準庫的補充。業務開發中常用的函數有很多，如：assign,...

ermaoL 2019-08-23 18:02 評論0 收藏0
XCel 項目總結 - Electron 與 Vue 的性能優化

摘要：而這里的單元格信息是唯一的，所以直接通過為一個空對象賦值即可。和相關的知識和技巧高亮的列單元格采用展示。在中，被選中的單元格會高亮相應的行和列，以提醒用戶。 showImg(https://segmentfault.com/img/bVGkdk?w=900&h=500); XCEL 是一個 Excel 數據清洗工具，其通過可視化的方式讓用戶輕松地對 Excel 數據進行篩選。 XCEL...

XUI 2019-08-22 10:45 評論0 收藏0