ソースを参照

fix: 修复水印重复叠加问题 (#2622)

Co-authored-by: whong <whif@foxmail.com>
予ヾ 2 年 前
コミット
3b0077dc73
1 ファイル変更6 行追加0 行削除
  1. 6 0
      src/hooks/web/useWatermark.ts

+ 6 - 0
src/hooks/web/useWatermark.ts

@@ -4,10 +4,15 @@ import { addResizeListener, removeResizeListener } from '/@/utils/event';
 import { isDef } from '/@/utils/is';
 
 const domSymbol = Symbol('watermark-dom');
+const sourceMap = new WeakMap<HTMLElement, {}>();
 
 export function useWatermark(
   appendEl: Ref<HTMLElement | null> = ref(document.body) as Ref<HTMLElement>,
 ) {
+  const appendElRaw = unref(appendEl);
+  if (appendElRaw && sourceMap.has(appendElRaw)) {
+    return sourceMap.get(appendElRaw);
+  }
   const func = useRafThrottle(function () {
     const el = unref(appendEl);
     if (!el) return;
@@ -82,6 +87,7 @@ export function useWatermark(
     const { clientHeight: height, clientWidth: width } = el;
     updateWatermark({ str, width, height });
     el.appendChild(div);
+    sourceMap.set(el, { setWatermark, clear });
     return id;
   };