首页 > 其他 > 详细

Vue实现PDF导出和打印功能

时间:2020-06-02 14:48:37      阅读:943      评论:0      收藏:0      [点我收藏+]

1.在Vue页面上实现PDF导出和打印功能依赖于两个npm插件,分别为vue-to-pdf和vue-easy-printer。

安装命令:

npm i vue-to-pdf --save
npm i vue-easy-printer --save

2.这两个插件都可以页面局部打印和导出,先在想操作的dom节点上加入id和ref:

<div id="exportPdf" ref="exportPdf">
</div>

3.在按钮上加入点击事件:

<input type="button" @click="printPdf">打印</input>
<input type="button" @click="savePdf" >导出(pdf)</input>

4.定义函数:

savePdf(){
    this.$PDFSave(this.$refs.exportPdf, "我的文件");
},
printPdf(){
     this.$easyPrint(‘exportPdf‘,"我的文件",‘portrait‘);
}

 

Vue实现PDF导出和打印功能

原文:https://www.cnblogs.com/ljygirl/p/13030839.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!