fix render issue (#19)

* fix render issue * Create ten-icons-mix.md
niikeec · May 28, 2024 · cd26778 · cd26778
1 parent 78b7ed4
commit cd26778
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/.changeset/ten-icons-mix.md b/.changeset/ten-icons-mix.md
@@ -0,0 +1,5 @@
+---
+"@virtual-grid/react": patch
+---
+
+fix rerender issue
diff --git a/packages/react/src/useGrid.tsx b/packages/react/src/useGrid.tsx
@@ -33,6 +33,8 @@ export const useGrid = <
   const { scrollRef, overscan, onLoadMore, loadMoreSize, ...options } = props;
   const { getItemId, getItemData, invert, ...measureOptions } = options;
 
+  const rerender = React.useReducer(() => ({}), {})[1];
+
   const [gridWidth, setGridWidth] = React.useState(0);
   const [gridHeight, setGridHeight] = React.useState(0);
 
@@ -48,7 +50,10 @@ export const useGrid = <
   setOptions({ ...options, width, height });
 
   // Measure grid when options that require a measure change
-  useDeepCompareMemo(measure, [measure, measureOptions, width, height]);
+  useDeepCompareMemo(() => {
+    measure();
+    rerender();
+  }, [measure, rerender, measureOptions, width, height]);
 
   // Check if grid size should be observed
   const observeGrid = observeGridSize(props);