vbenjs / vue-vben-admin

A modern vue admin panel built with Vue3, Shadcn UI, Vite, TypeScript, and Monorepo. It's fast!
https://www.vben.pro
MIT License
25.17k stars 6.86k forks source link

水印多次设置后会叠加,清除也不生效 #2610

Closed zhxbing closed 1 year ago

zhxbing commented 1 year ago

⚠️ 重要 ⚠️ 在进一步操作之前,请检查下列选项。如果您忽视此模板或者没有提供关键信息,您的 Issue 将直接被关闭

描述 Bug

使用水印时,设置水印,多次设置后水印会叠加(水印内容不相同),清空水印无效;

复现 Bug


// 第一次执行
const { setWatermark, clear } = useWatermark()
clear();
setWatermark(“张三 1234”);
//第二次执行
const { setWatermark, clear } = useWatermark()
clear();
setWatermark(“李四 4567”);
``

## 系统信息

- 操作系统:
- Node 版本: 16.19.0
- 包管理器 (npm/yarn/pnpm) 及其版本: yarn 1.22.19
zhxbing commented 1 year ago

没有人遇到相同的问题吗?

M69W commented 1 year ago

使用水印时,设置水印,多次设置后水印会叠加(水印内容不相同),清空水印无效;

估计没人会多次设置吧?

lwyidname commented 1 year ago

没有人遇到相同的问题吗?

我的也是多次设置,也是不行

zty42 commented 1 year ago

https://vben.vvbin.cn/#/feat/watermark

文档里面这个例子 Create 按钮和 Reset 按钮就是分别设置了两次水印呀

zhxbing commented 1 year ago

文档上的的确是可以的,但实际试了的确不行。 业务场景是,一个账号有多种权限类型,做切换设置不同的账号信息。 应该是写在store里面的缘故,导致clear方法中 const domId = unref(watermarkEl) 无法获取到domId节点,所以无法清空。

我现在改到 layout/index.vue里面可以实现,onMounted做初始化,watch监听账号切换重新设置,就可以。

wangjue666 commented 1 year ago

已修复,可重新尝试网站水印示例