table表单的数据导出(execl)

做一个程序员

已于 2022-12-27 14:12:49 修改

阅读量763

点赞数 1

文章标签： javascript typescript 前端

于 2022-12-27 14:10:33 首次发布

本文链接：https://blog.csdn.net/weixin_52153452/article/details/128455048

版权

table表单的数据导出(execl)

1. 下载xlsx包文件

pnpm add xlsx -D

2. 引入工具函数 utils和writeFileXLSX

import { utils, writeFileXLSX } from 'xlsx';

3. 处理表单数据

将表单数据简单的处理一下，下面有一个简单的例子：

目标数据：
在这里插入图片描述

// 需要传入的数据格式
[
	{
		id: **,
		温度: **,
		湿度: **,
		时间: **
	},
	...
]

可以将以下代码绑定到一个按钮上，作为函数使用，可以直接导出文件。

// 将表单数据转为sheet数据, table为上面格式的table表单数据格式
const ws = utils.json_to_sheet(table);
// 生成一个workBook
const wb = utils.book_new();
// 将sheet数据加到workBook中
utils.book_append_sheet(wb, ws, 'Data');
// 写入数据到xlsx并且导出文件
writeFileXLSX(wb, `${exportDevice.value}.xlsx`)