vue中实现html页面导出word和pdf的办法

vue中实现html页面导出word和pdf的办法,第1张

1.使用预先写好的与html相似的word文档模板,将用户输入的数据与读取出来的模板结合生成指定名称的docx文件

vue+elementUI导出数据为word文档

2.使用Jquery插件和file-save来生成word文档

vue 前端导出word、excel、pdf

1.使用html2canvas和JsPDF来生成pdf文件

html2canvas生成截图后,用JsPDF转为pdf文件

上面有,这是运用插件截图可能会产生的问题的解决方案

2.调用浏览器的打印方法生成pdf文件

vue 项目导出pdf两种方式

utils - htmlToPdf.js

main.js

1、如果在多个页面使用,给函数定义一个参数,参数为要导出页面部分的id。

将 '#pdfDom' 替换为参数即可

2、将导出文件的名称也作为参数传入函数

此种方式也可用于vue,尝试后可行,需要调节部分参数,但毕竟不太合适。

jQuery不需要调节。

https://github.com/zhangshaoliang/downLoadPDF

vue方式

jQuery方式

目前项目使用的是前端加后端方式,前端提供模板,echarts图表的话需要转为base64发送给后台。后台使用iText。目前存在的问题是后台不支持css3语法,只支持到css2,所以复杂的样式页面显示错乱,考虑个别页面使用纯前端实现。

网站导航


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6152384.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-16
下一篇 2023-03-16

发表评论

登录后才能评论

评论列表(0条)

保存