vue 水印实现
Vue项目在页面添加水印功能, 不允许操作dom关闭水印
1.添加watermark-dom插件
npm i watermark-dom --save
- 引用 watermark-dom
import watermark from 'watermark-dom'
- 初始化水印
import { onMounted, onBeforeUnmount, nextTick } from 'vue';
import { storageLocal } from '/@/utils/storage';
const handleWatermark = () => {
nextTick(() => {
const userInfo: any = storageLocal.getItem('userInfo');
watermark.load({
watermark_txt: userInfo.name + ' ' + userInfo.code,
watermark_color: '#666' //水印字体颜色
});
});
};
onMounted(() => {
handleWatermark();
});
- 效果
`