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

html-css09

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两种方式

在做项目过程中会用到导出功能,就是将HTML页面导出,生成为word文档,实际上就是导出table,会遇到某些图片超出整个word宽度的问题,怎么设置都不行,研究很久终于发现可以生效的css样式写法,如下,在行内对图片写样式:

<img width="556" style="width:100%max-width:100%" />

其中:width=“556”是写给word里的table识别用的,style的内容是写给html页面识别的,这样写就能控制导出图片宽度