Rubicon/tutu
1
0
Fork 0
Code Issues 18 Pull requests Projects Activity Actions

Masonry: fix do not reflow in resizing

Browse source
This commit is contained in:
thislight 2024-11-24 16:45:24 +08:00
parent 5199f2bb6a
commit 2c35950d27
No known key found for this signature in database
GPG key ID: FCFE5192241CCD4E
1 changed files with 27 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/platform/Masonry.tsx
View file

@ -46,30 +46,49 @@ function createCompatMasonry(
const size = createElementSize(element);
const treeMutObx = new MutationObserver(() => {
layout.reloadItems?.();
});
let layoutNotRequested = true;
onCleanup(() => treeMutObx.disconnect());
const reflow = () => {
layout.layout?.();
layoutNotRequested = true;
};
createRenderEffect(() => {
const opts = options();
layout.option?.(opts);
});
const treeMutObx = new MutationObserver(() => {
layout.reloadItems?.();
if (layoutNotRequested) {
layoutNotRequested = false;
requestAnimationFrame(reflow);
}
});
onCleanup(() => treeMutObx.disconnect());
createRenderEffect(() => {
treeMutObx.observe(element, { childList: true });
});
createRenderEffect(() => {
const width = size.width; // only tracking width
layout.layout?.();
if (layoutNotRequested) {
layoutNotRequested = false;
requestAnimationFrame(reflow);
}
});
if (import.meta.hot) {
import.meta.hot.on("vite:afterUpdate", () => {
layout.layout?.();
});
const onHotReloadUpdate = () => {
if (layoutNotRequested) {
layoutNotRequested = false;
requestAnimationFrame(reflow);
}
};
import.meta.hot.on("vite:afterUpdate", onHotReloadUpdate);
import.meta.hot.off("vite:afterUpdate", onHotReloadUpdate);
}
}