SheetJS js-xlsx如何獲取active sheet index工作表索引名稱?

12 月 12, 2019 | Javascript, | 0 comments

解析 SheetJS js-xlsx:在前端讀取並操作 Excel 表格

在前端應用中,SheetJS js-xlsx 是一個功能豐富的 JavaScript 函式庫,專門用於處理 Excel 表格。這篇教學將引導您如何使用 js-xlsx 來匯入和讀取 Excel 表單,並更進一步地介紹如何從多個工作表中提取您所需的數據。

安裝 SheetJS js-xlsx

首先,確保您的項目中已經安裝了 SheetJS js-xlsx。您可以使用 npm 或 yarn 進行安裝:

npm install xlsx

yarn add xlsx

基本的 Excel 表單讀取

讓我們先從基本的 Excel 表單讀取開始。以下是一個簡單的範例:

import * as XLSX from 'xlsx';

// 讀取 Excel 文件
const fileInput = document.getElementById('excel-file-input');

fileInput.addEventListener('change', (e) => {
  const file = e.target.files[0];

  const reader = new FileReader();

  reader.onload = (event) => {
    const data = new Uint8Array(event.target.result);
    const workbook = XLSX.read(data, { type: 'array' });

    // 獲取第一個工作表的數據
    const firstSheetName = workbook.SheetNames[0];
    const worksheet = workbook.Sheets[firstSheetName];

    // 現在您可以在這裡使用 'worksheet' 進行數據操作
    console.log(XLSX.utils.sheet_to_json(worksheet, { header: 1 }));
  };

  reader.readAsArrayBuffer(file);
});

這段程式碼允許用戶選擇一個 Excel 文件,並在讀取後將其內容顯示在控制台上。這只是一個基本的範例,您可以根據項目需求進行擴展。

提取最後保存的工作表

如果您的 Excel 文件包含多個工作表,您可能需要僅提取最後保存的工作表。以下是一個方法:

// 獲取活動工作表的索引
let activeTab = 0;

// 檢查是否存在活動工作表的信息
if (typeof workbook.Workbook.WBView !== undefined) {
  if (Array.isArray(workbook.Workbook.WBView) && workbook.Workbook.WBView.length > 0) {
    activeTab = workbook.Workbook.WBView[0].activeTab;
  }
}

// 獲取活動工作表的名稱
const activeSheetName = workbook.SheetNames[activeTab];

// 獲取對應的工作表物件
const activeWorksheet = workbook.Sheets[activeSheetName];

這個方法通過檢查活動工作表的信息,從而確定最後保存的工作表的索引,並透過該索引來獲取對應的工作表物件。

進階操作

SheetJS 還提供了豐富的 API,可以進行更多進階的操作,例如修改數據、新增行列、應用樣式等。您可以查閱 SheetJS 官方文檔 以深入了解這些功能。

這篇教學帶您快速入門 SheetJS js-xlsx,從基本的 Excel 表單讀取開始,到提取最後保存的工作表。請注意,使用這些工具時,應謹慎處理來源不受信任的 Excel 文件,以避免潛在的安全問題。

這只是 SheetJS 的冰山一角,希望這個教學能夠啟發您在前端應用中更廣泛地應用 js-xlsx。