vue 实现打印功能,打印的时候加上水印图片

JavaScript019

vue 实现打印功能,打印的时候加上水印图片,第1张

安装依赖

npm install print-js --save

页面引入

import print from 'print-js'

打印按钮

<el-button type="primary" v-if="itemList.length>0" @click="printSomething">打印</el-button>

打印的内容

使用

不想要打印的内容加上水印图片 删除这块内容

<p class="titleImg"><img class="titleLogo" src="@/assets/logo/printLogo.jpg" alt=""></p> 

答: 如果你的水印是动态的,比如需要用到在登陆之后才能获取到的信息,可以在登陆接口成功的回调之后,调用一次该水印方法,然后将这些信息保存到localStorage中去,在main.js中获取,再调用一次该水印方法。这样,就可以实现动态的水印,且刷新不会消失。

参考: vue项目中添加水印