前言
在前端项目开发中，经常需要导出 Excel 表格，而常用的 Excel 工具如 Excel、WPS，不仅安装麻烦，还需要付费。所幸，开源社区提供了一款优秀的 npm 包 excel-export-lhan 用于前端导出 Excel 表格，本文将详细介绍如何使用该 npm 包。
安装
使用 npm 进行安装：
npm install excel-export-lhan
使用
在导出 Excel 表格之前，需要事先准备好导出的数据，以及表格的设置。
数据设置
创建一个数组 dataset，数组每个项代表表格的一行数据：
-- -------------------- ---- ------- ----- ------- - -- ----- ----- ----- --- ----- --- -- - ----- ----- ----- --- ----- --- ---
表格设置
创建一个对象 tableConf，该对象包含表格的各项属性。
-- -------------------- ---- -------
----- --------- - -
----- --------- -- ----
----- -- -- ----
-------- ----- -- ---
----- -------- -- ----
-- -
-------- -----
----- --------
-- -
-------- -----
----- --------
---
----- -- -- --------
--导出设置
创建一个对象 options，该对象包含导出时的配置。
const options = {
filename: 'excel-export', // 导出文件名
sheetname: '导出表格' // 导出 sheet 表格名
};使用 excel-export-lhan 包导出表格：
-- -------------------- ---- -------
----- ----------- - -----------------------------
----- ------ - --------------------------
----- ---------------
----- ---------------
----- -------------------
----
-------- ---------------- -
----- ---- - ---
------------------- -- -
---------------------- ----------- -------------
---
------ -----
-
----- ------ - ------------------ -- ------
----- ------ - -------------------------- -- ------ ------ --
----- --------- - --------------------------------------- - ------- -- ------
----- ---- - ----------------------------
------------- - ---------------- - -------
--------- - ----------
-------------通过 require('excel-export-lhan') 引入 excel-export-lhan 包，使用方法为 excelExport.buildExport(dataArray)，其参数 dataArray 为数据数组，即 [tableConf]，返回一个实例 report。
使用 report.generate() 生成表格数据，再将数据转换为 base64 格式，并创建下载链接，最后模拟鼠标点击实现下载。
示例代码
-- -------------------- ---- -------
----- ------- - --
----- -----
----- ---
----- ---
-- -
----- -----
----- ---
----- ---
---
----- --------- - -
----- ---------
----- --
-------- -----
----- --------
-- -
-------- -----
----- --------
-- -
-------- -----
----- --------
---
----- --
--
----- ------- - -
--------- ---------------
---------- ------
--
----- ----------- - -----------------------------
----- ------ - --------------------------
----- ---------------
----- ---------------
----- -------------------
----
-------- ---------------- -
----- ---- - ---
------------------- -- -
---------------------- ----------- -------------
---
------ -----
-
----- ------ - ------------------
----- ------ - --------------------------
----- --------- - --------------------------------------- - -------
----- ---- - ----------------------------
------------- - ---------------- - -------
--------- - ----------
-------------总结
通过上述方法，我们得以使用 excel-export-lhan 包实现前端导出 Excel 表格。除此之外，还可以根据需要通过调整表格设置，实现更加丰富的表格效果。该 npm 包提供了一种简单且有效的方式，大大提高了前端开发的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005777981e8991b448ead56