vue+elementUI导出数据为WORD
作者:
AR1N | 来源:发表于
2019-08-11 22:37 被阅读0次
导出为WORD:
- 获取要导出的数据;
- 将获取到的数据渲染到一个容器中
<div id=domHtml></div
,并设置样式属性:display:none
;
- 获取容器文档内容
let htmlContent = document.getElementById ('domHtml').innerHTML
;
4.创建Blob对象:(放入blob对象中,转换类型,创建下载链接并执行)
let blob = new Blob([this.htmlContent ], {
type: 'application/msword'
//word文档为msword,docx为vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8,pdf文档为pdf,msexcel 为excel
});
let objectUrl = URL.createObjectURL(blob);
let link = document.createElement("a");
let fname = `文件名`; //下载文件的名字
link.href = objectUrl;
link.setAttribute("download", fname);
document.body.appendChild(link);
link.click();
PS:过程中遇到的问题:
- 导出后样式不起作用:(必须使用行内样式,或者将样式写到<style></style>中一起以文档流方式传入blob 对象中,而且行内样式使用margin,padding样式属性也是不会起作用的,只能使用table布局);
- 导出后可能个别字会被加粗:(需要在样式属性中设定统一的字体
font-family
属性)
需求描述:业务方给了个word模板,需要我们查出来数据填充进去,并且导出为word文件。部分地方需要循环多行展示。...
使用场景:前端下载表格中用户查看的数据。 1. 前端VUE+ElementUI导出复杂(多级表头、合并单元格)ex...
1.说明 使用PowerDesigner设计数据库表,然后将表设计导出为Word文档,以及MySQL数据库对应的D...
前言 最近工作中,需要将查询的一段时间的数据可视化,并导出为word格式。由于对word操作不熟悉,查阅了一下相关...
前言 最近工作中,需要将查询的一段时间的数据可视化,并导出为word格式。由于对word操作不熟悉,查阅了一下相关...
Java导出Markdown格式的数据字典 前一阵子老板让我写个把项目的数据库字典导出来,但是不要word格式,就...
从stata的dataset中直接导出数据到word里面小数点导出的时候经常有问题 这个时候putdocx命令是最...
任何报表都以页面的形式呈现,因此看作一个普通的功能模块,报表中的数据可以导出为Excel、Word、PPT、PDF...
angularjs 导出数据到Word: 学习来源是https://www.jianshu.com/p/db35f...
网友评论