VUE整合VUE-PRINT-NB实现前端打印功能
插件安装
npm install vue-print-nb --save
插件安装时最好在package.json中同时加入依赖信息,便于项目上其他人员拉取。
简单实现
<template>
<div>
<div id="printTest" >
<p>赵云</p>
<p>关羽 </p>
<p>马超</p>
<p>张飞</p>
</div>
<button v-print="'#printTest'">打印</button>
</div>
</template>
<script>
</script>
<style>
</style>
在需要打印的地方加上一个ID属性就好了,表格什么的操作都是这样,然后在按钮上通过v-print="'#ID'"来调用插件打印。
图片不是上述的代码,是打印的一个表格效果。这边需要注意的一点是,更多设置里的很多选项是根据你的打印驱动来的,比如我之前在插上打印机WIN10自动安装的驱动,纸张尺寸只给了我A4和信纸两个选项,后来从官网重新安装了一份EPSON LQ-610KII的驱动,选项就很多了。
后来从官网重新安装了一份EPSON LQ-610KII的驱动,选项就很多了。
总体来说调用还是很简单的,不管是激光打印还是针式打印机,用起来还挺方便,后续看看还有没有坑。