vue 使用print-js
前言只要有软件的开发就会有管理后台的开发,然而就现在很多管理后台都是需要打印功能的,其实也有那种前端生成pdf的需求,但总的来说,个人还是觉得用打印里面的“另存为PDF”比较香。我这里使用的是print-js,官网优点:可打印多种格式内容(pdf、json、html、image),默认类型为pdf。打印json时可以添加表头。打印html页时可以继承原有页面的样式,可以局部打印,过滤掉要打印的元素
·
前言
只要有软件的开发就会有管理后台的开发,然而就现在很多管理后台都是需要打印功能的,其实也有那种前端生成pdf的需求,但总的来说,个人还是觉得用打印里面的“另存为PDF”比较香。
我这里使用的是print-js
,官网
- 优点:可打印多种格式内容(pdf、json、html、image),默认类型为pdf。打印json时可以添加表头。打印html页时可以继承原有页面的样式,可以局部打印,过滤掉要打印的元素。
那么打印怎么实现呢?请接着往下看
安装
npm install print-js --save
引入
在main.js文件里面引入
import Print from 'vue-printjs'
Vue.use(Print)
使用
我这里是简单的举例,就没有写样式,如果需要不被打印,那么就在元素上加上no-print
的类就可以啦!
<div ref="print">
<p>需要打印的内容</p>
<p class="no-print">不需要被打印</p>
</div>
<el-button size="small" type="primary" class="btn" @click="print">打印</el-button>
// 打印
print() {
this.$print(this.$refs.form)
},
我这是最简单的用法了,官方介绍更全哦,可以去官网看看更多使用类型个方法
更多推荐
已为社区贡献3条内容
所有评论(0)