前端处理 Excel 文件

引入XLSX 

   XLSX 是一个流行的 JavaScript 库,用于处理 Excel 文件(包括 .xls 和 .xlsx 格式)。它可以在 Node.js 环境和浏览器中运行,提供了丰富的 API 来读取、写入、修改 Excel 文件。当你使用 import * as XLSX from 'xlsx'; 这行代码时,你实际上是在从 xlsx 包中导入所有的导出内容,并将它们作为一个名为 XLSX 的对象来使用。这里有几个基本的 XLSX 库用法示例,展示如何使用这个库来读取和写入 Excel 文件:

读取 Excel 文件

假设你有一个名为 example.xlsx 的 Excel 文件,你想读取其中的数据。

const workbook = XLSX.readFile('example.xlsx'); // 读取 Excel 文件  
const firstSheetName = workbook.SheetNames[0]; // 获取第一个工作表的名称  
const worksheet = workbook.Sheets[firstSheetName]; // 通过名称获取第一个工作表  
  
// 将工作表转换为 JSON 对象  
const json = XLSX.utils.sheet_to_json(worksheet, {header:1}); // {header:1} 表示第一行为表头  
console.log(json);

写入 Excel 文件

如果你想创建一个新的 Excel 文件或修改一个现有的文件并保存它,你可以这样做:

// 创建一个新的工作簿  
const workbook = XLSX.utils.book_new();  
  
// 创建一个新的工作表  
const worksheet = XLSX.utils.json_to_sheet([{name: "Sheet JS", data: [1, 2, 3]}]);  
  
// 将工作表添加到工作簿  
XLSX.utils.book_append_sheet(workbook, worksheet, "My Sheet");  
  
// 写入文件  
XLSX.writeFile(workbook, 'new_example.xlsx');

注意,上面的示例中 json_to_sheet 函数的输入数据格式是为了展示如何创建一个包含特定数据的工作表,并不完全符合 Excel 表格的常见数据结构。通常,你会传入一个对象数组,每个对象代表一行,对象的键对应列名。

表格数据转为 Excel 文件并导出

npm install file-saver 
import { saveAs } from 'file-saver';
//引入导出api
 let data=[
    [1,2,3],
    [4,5,6]
]
// 将数据转换为工作表
        const worksheet = XLSX.utils.aoa_to_sheet(data);
        // 创建工作簿并添加工作表
        const workbook = XLSX.utils.book_new();
        XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
        // 生成Excel文件
        const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
        // 使用blob和FileReader创建一个URL然后下载
        const dataBlob = new Blob([excelBuffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8' });
        saveAs(dataBlob, 'demp.xlsx');

注意事项

  • 当你在 Node.js 环境中使用 XLSX 库时,需要确保你已经通过 npm 或 yarn 安装了它(npm install xlsx 或 yarn add xlsx)。
  • 在浏览器中使用时,你可能需要通过 <script> 标签或类似的方式引入库文件。
  • XLSX 库支持多种格式的 Excel 文件(包括 .xls),但处理 .xls 文件时可能需要额外的库(如 SheetJS/xlsx 的一部分功能)或依赖。
  • 使用 XLSX 库时,请确保遵循其 API 文档,以充分利用其功能。
  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值