refactor(Watermark): change useState to useRef (#52089)
Some checks are pending
Publish Any Commit / build (push) Waiting to run
🔀 Sync mirror to Gitee / mirror (push) Waiting to run
✅ test / lint (push) Waiting to run
✅ test / test-react-legacy (16, 1/2) (push) Waiting to run
✅ test / test-react-legacy (16, 2/2) (push) Waiting to run
✅ test / test-react-legacy (17, 1/2) (push) Waiting to run
✅ test / test-react-legacy (17, 2/2) (push) Waiting to run
✅ test / test-node (push) Waiting to run
✅ test / test-react-latest (dom, 1/2) (push) Waiting to run
✅ test / test-react-latest (dom, 2/2) (push) Waiting to run
✅ test / test-react-latest-dist (dist, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist, 2/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 1/2) (push) Blocked by required conditions
✅ test / test-react-latest-dist (dist-min, 2/2) (push) Blocked by required conditions
✅ test / test-coverage (push) Blocked by required conditions
✅ test / build (push) Waiting to run
✅ test / test lib/es module (es, 1/2) (push) Waiting to run
✅ test / test lib/es module (es, 2/2) (push) Waiting to run
✅ test / test lib/es module (lib, 1/2) (push) Waiting to run
✅ test / test lib/es module (lib, 2/2) (push) Waiting to run
👁️ Visual Regression Persist Start / test image (push) Waiting to run

This commit is contained in:
bubucuo 2024-12-23 07:20:39 -08:00 committed by GitHub
parent fb65341c1e
commit a80e252a20
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -27,16 +27,16 @@ export default function useWatermark(
removeWatermark: (container: HTMLElement) => void,
isWatermarkEle: (ele: Node) => boolean,
] {
const [watermarkMap] = React.useState(() => new Map<HTMLElement, HTMLDivElement>());
const watermarkMap = React.useRef(new Map<HTMLElement, HTMLDivElement>());
const appendWatermark = (base64Url: string, markWidth: number, container: HTMLElement) => {
if (container) {
if (!watermarkMap.get(container)) {
if (!watermarkMap.current.get(container)) {
const newWatermarkEle = document.createElement('div');
watermarkMap.set(container, newWatermarkEle);
watermarkMap.current.set(container, newWatermarkEle);
}
const watermarkEle = watermarkMap.get(container)!;
const watermarkEle = watermarkMap.current.get(container)!;
watermarkEle.setAttribute(
'style',
@ -55,20 +55,20 @@ export default function useWatermark(
}
}
return watermarkMap.get(container);
return watermarkMap.current.get(container);
};
const removeWatermark = (container: HTMLElement) => {
const watermarkEle = watermarkMap.get(container);
const watermarkEle = watermarkMap.current.get(container);
if (watermarkEle && container) {
container.removeChild(watermarkEle);
}
watermarkMap.delete(container);
watermarkMap.current.delete(container);
};
const isWatermarkEle = (ele: any) => Array.from(watermarkMap.values()).includes(ele);
const isWatermarkEle = (ele: any) => Array.from(watermarkMap.current.values()).includes(ele);
return [appendWatermark, removeWatermark, isWatermarkEle];
}