使用xlsx插件实现json导出excel表格

美酒没故事°

已于 2024-02-04 10:45:45 修改

阅读量1.2k

点赞数 1

分类专栏：前端相关的配套使用文章标签： excel 导出 vue Blob.js Export2Excel.js

于 2020-07-10 16:30:38 首次发布

本文链接：https://blog.csdn.net/qq_42618566/article/details/107253501

版权

前端相关的配套使用专栏收录该内容

37 篇文章 2 订阅

订阅专栏

在这里插入图片描述

https://blog.csdn.net/qq_42618566/article/details/127978974

<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport"
			content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<script src="https://unpkg.com/xlsx@0.18.5"></script>
		<title>json to excel</title>
	</head>
	<body>
		<button onclick="toExcel()">导出</button>

		<script>
			const demo = [{
					name: "电量",
					cusp: "111",
					peak: "222",
					flat: "333",
					grain: "444"
				},
				{
					name: "电费",
					cusp: "111",
					peak: "222",
					flat: "333",
					grain: "444"
				},
				{
					name: "服务费",
					cusp: "111",
					peak: "222",
					flat: "333",
					grain: "444"
				}
			];

			function toExcel() {
				const fileName = "json导出的例子.xlsx";
				const sheetName = "Sheet 1";

				const excel = XLSX.utils.book_new();
				const data = XLSX.utils.json_to_sheet(demo);


				XLSX.utils.book_append_sheet(excel, data, sheetName);
				XLSX.writeFile(excel, fileName);
			}
		</script>
	</body>
</html>