better-xlsx 插件使用(React Hooks)

安装

npm install better-xlsx --save

使用

• 以下是基本使用的解释，具体下载表格的内容需按自己的需求做

import React from 'react';
import xlsx from 'better-xlsx';
import saveAs from 'jszip/vendor/FileSaver';  // nodeJS 自带的功能

const Demo = ()=>{
     const download = () =>{
             const file = new xlsx.File();  // 使用
             const sheet = file.addSheet('文件名'); // 设置文件内的文档名
             const header = sheet.addRow();  // 在文档内新增一行
             // 行高
             header.setHeightCM(rowHeight);  // 设置行高为1cm
             const cell = header.addCell();  // 在header这一行新增一个单元格
             // 列宽
             sheet.col(0).width = 15;  // 设置这个文档内的第一列列宽度为15
             cell.value = '第一个单元格的数据'; // 设置单元格的数据
             cell.style.fill.patternType = 'solid'; // 设置单元格的模式类型
             // (前两位数设置透明度,后六位是十六进制的颜色)
             cell.style.fill.fgColor = '00FEFF00'; // 单元格背景颜色
             cell.style.align.h = 'center';  // 设置单元格高为居中
             cell.style.align.v = 'center'; // 设置单元格宽为居中
             // (top、left、bottom、right)[上、左、下、右]
             cell.style.border.top = 'thin';  // 设置上边框为实心线
             // (topColor、leftColor、bottomColor、rightColor)[上、左、下、右](透明度(两位)+16进制的颜色(六位))
             cell.style.border.topColor = 'ff7e6a54'; // 设置上边框线的颜色
             cell._style.font.bold = true;  // 文字加粗
             // 保存文件
             file.saveAs('blob').then((content) => {
              saveAs(content, 'demo.xlsx');
            });
     }
     renter <span onclick={()=> download}>Download</span>
}

文档地址

文档地址

gitHub地址

使用Demo

PS

• 指导更多使用 better-xlsx 的知识可以在下方留言
• 刘师兄的微信：LMT0797 ，备注：掘金