前端导出word文档,包含(图表),先把canvas转成图片,再导出,还有点问题,不过功能实现了,不用通过后台,看到的大神可以留言提出改进的方法
【前端导出word(包含图表)】代码如下:
canvas转图片用的是html2canvas插件
Install:npm install html2canvas
use:import html2canvas from ‘html2canvas’;
vue 组件代码:
文章图片
Vue组件内的js代码:
文章图片
以上代码就是把canvas转成base64编码的图片的过程,接下来就是导出成word了,代码如下:
这是需要引入的一个导出的js库 html-docx.js 可以百度下载到本地
以下就是导出方法:
wordExport:function(e){
var cont = document.getElementById(“pdfDom”).innerHTML;
var content = ‘’ +cont;
var converted = htmlDocx.asBlob(content,{orientation:“landscape”});
saveAs(converted, ‘回溯分析报告.docx’);
}
好了,这样就可以导出word了,且没有用到后台,不过前端页面就有点明显的卡顿了,欢迎留言~~~
推荐阅读
- 原创|通俗易懂!详解Softmax及求导过程、Python实现、交叉熵
- 原创|使用webmagic模拟post表单提交爬取易查分成绩
- 原创|解决使用echarts做动态数据饼图展示中data如何传值的问题
- 自学|jdk1.8谷歌版本中文文档
- 原创|日期类型转字符串 oracle和java的区别
- 原创|centos7.2 安装和启动docker
- 安卓中Rxjava
- 原创|力扣练手35 搜索插入位置 JAVA版
- 原创|浅析STM32H7 FDCAN(一)
- minerOS设置哈鱼矿池ETH教程