通过使用Vue的生命周期钩子函数和window对象的resize事件来实现水印根据窗口大小适配的功能：
在Vue文件的
script模块中 引入水印组件：1
import watermark from '@zsit/watermark';
在
script模块的export default里，通过钩子函数mounted监听窗口大小的变化，并在销毁组件前移除事件监听器：1
2
3
4
5
6mounted(){
window.addEventListener('resize',this.handleResize)
},
beforeDestroy(){
window.removeEventListener('resize',this.handleResize)
},在
script模块的里，定义handleResize方法来调用水印：1
2
3
4
5
6
7
8
9
10
11
12methods: {
handleResize(){
watermark({
watermark_txt: this.watermark_txt,//水印内容
watermark_y:80,//水印y轴初始位置
watermark_y_space: 60,
watermark_fontsize: "12px",
watermark_width: 60,
watermark_height: 60,
});
}
}至此，所生成的水印可根据窗口的变化而覆盖整个窗口。