将表格table作为execl导出
2024-10-07 12:24:13
有时候的需求是从后台获取数据,然后将数据变成execl,进行导出,下载成execl 解决的方法是
一,比较方便的是
这有个插件 可以直接用
https://www.npmjs.com/package/xlsx
二,这种是自己写的一种
1.渲染数据的模板
<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel"
xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta charset="utf-8" />
<!--[if gte mso 9]>
<xml>
<x:ExcelWorkbook>
<x:ExcelWorksheets>
<x:ExcelWorksheet>
<x:Name><%=sheetName%></x:Name>
<x:WorksheetOptions>
<x:DisplayGridlines/>
</x:WorksheetOptions>
</x:ExcelWorksheet>
</x:ExcelWorksheets>
</x:ExcelWorkbook>
</xml><![endif]-->
</head>
<body><%=tableHTML%>
</body>
</html>
2.点击导出execl 点击导出按钮 然后执行这个函数
// 导出文件
clickExport : function(event) {
var _this=this;
this.renderTable(function(){
// 获取当前的图表类型
var type = 'table';
// sheet名称
var sheetName = '专利信息汇总表 ';
if (type == "table") {
_this.exportExcel(sheetName, _this.$(".execltable").find("table"), event);
}
});
},
// 导出为excel文件
exportExcel : function(sheetName, $table, event) {
var base64 = window.btoa(unescape(encodeURIComponent(this.tableExcelTemplate({
sheetName : sheetName,
tableHTML : $table.prop("outerHTML")
}))));
// 获取下载链接
var uri = 'data:application/vnd.ms-excel;base64,' + base64;
// 设置下载名称
event.target.download = sheetName + ".xls";
// 触发下载
event.target.href = uri;
},
renderTable:function(callback){
var result=this.tableView.getDataExecl();
this.$(".execltable").html(this.tableTemplate({
rows:result
}));
callback();
},
最新文章
- [IOS]Swift 遍历预制的本地资源文件
- vim 标记 mark 详解 (转载)
- 提取data.frame中的部分数据(不含列标题和行标题)
- DSP EPWM学习笔记1 - EPWM定时中断
- hdu 2149 Public Sale (博弈规律题)
- js spin 加载动画(loading)
- iOS 通知中心 NSNotificationCenter
- redis基本命令的演示:
- python 使用xrld
- WebPack-Loader
- Docker &; ASP.NET Core (1):把代码连接到容器
- Vue(小案例_vue+axios仿手机app)_go实现退回上一个路由
- react native 项目使用 expo 二维码扫描失败
- Git Base For Linux
- Confluence 6 已经存在的 Confluence 安装配置一个数据源连接
- Linux SSH登录很慢的解决方法
- Swift开发iOS项目实战视频教程(二)---图片与动画
- C++中路径的处理方法(string)
- zabbix3.0.4通过自定义shell脚本添加对关键日志文件的监控
- [ 9.11 ]CF每日一题系列—— 441C暴力模拟
热门文章
- Android常见内存泄露,学会这六招优化APP性能
- C++中struct和class定义类区别
- Codeforces Round #558 (Div. 2)B(SET,模拟)
- 洛谷P1360 [USACO07MAR]黄金阵容均衡Gold Balanced L…
- Shape Number (最小表示法)
- 上传图片时实时显示功能使用uploadPreview.js
- webpack配置Jquery全局包及全局包插件
- onCreateOptionsMenu
- Ubuntu ls可以查看到文件,图形界面却看不到
- vbox和宿主机共享文件夹