前端导出excel后没有单元格?-灵析社区

喝一杯吧可以吗

背景: 在项目开发中,经常需要下载模板/导出表单数据(excel)格式的需求,虽然xlsx库可以满足基本需求,但是有些excel表的样式很难定制化,所以想着自己封装一个 尝试: 封装思路: excel和table关联起来,而连接两者的桥梁为new Blob()构造函数,示例代码如下: HTML Table Example 姓名 年龄 职位 张三 28 工程师 李四 35 医生 王五 22 学生 // 获取table元素 var tableElement = document.querySelector('table'); // 获取table元素的domString表示 var tableDomString = tableElement.outerHTML; const blob = new Blob([tableDomString], { type: "application/vnd.ms-excel" }); // 创建一个 元素用于下载 Excel 文件 const a = document.createElement("a"); a.href = URL.createObjectURL(blob); a.download = 'test2' + '.xlsx'; // 设置下载文件的名称 // 触发点击下载 a.click(); a.remove(); 结果: 可以正常生成excel文件 ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241005/699fe4039e436f0c94a2d8789cd4b326.png) 缺点: 但是又有点不太像excel的格式,比如我想在excel表里面新增行或者列的话,样式会有问题。 希望有可编辑的单元格,类似这种 ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241005/9bb699d1903ec105e5197eb868c7126e.png)

阅读量:172

点赞量:0

问AI
如果现在让我推荐一个 "Excel" 的JS库,我一定会推荐 "ExcelJS" (https://link.segmentfault.com/?enc=8OZ%2FX9%2FAvIayMcftuHGBlw%3D%3D.Ie1TC%2FFJJqMmuuawvhpe9TuuHYfIuxEm4lI8C6DWUs3HBFtGnH5ILIJgql8WuFfy)。非常好用,而且样式定制也很简单。 * "这一定是前端导出Excel界的天花板~" (https://segmentfault.com/a/1190000042028092)