fix: reset pendingMeasuredCacheIndexes when options change (#511)

TanStack · Feb 20, 2023 · 2ea2f5a · 2ea2f5a
1 parent 41199b2
commit 2ea2f5a
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 6 deletions.
diff --git a/packages/virtual-core/src/index.ts b/packages/virtual-core/src/index.ts
@@ -430,15 +430,30 @@ export class Virtualizer<
     return this.scrollRect[this.options.horizontal ? 'width' : 'height']
   }
 
-  private getMeasurements = memo(
+  private memoOptions = memo(
     () => [
       this.options.count,
       this.options.paddingStart,
       this.options.scrollMargin,
       this.options.getItemKey,
-      this.itemSizeCache,
     ],
-    (count, paddingStart, scrollMargin, getItemKey, itemSizeCache) => {
+    (count, paddingStart, scrollMargin, getItemKey) => {
+      this.pendingMeasuredCacheIndexes = []
+      return {
+        count,
+        paddingStart,
+        scrollMargin,
+        getItemKey,
+      }
+    },
+    {
+      key: false,
+    },
+  )
+
+  private getMeasurements = memo(
+    () => [this.memoOptions(), this.itemSizeCache],
+    ({ count, paddingStart, scrollMargin, getItemKey }, itemSizeCache) => {
       const min =
         this.pendingMeasuredCacheIndexes.length > 0
           ? Math.min(...this.pendingMeasuredCacheIndexes)
@@ -487,14 +502,22 @@ export class Virtualizer<
   )
 
   private maybeNotify = memo(
-    () => [...Object.values(this.calculateRange()), this.isScrolling],
+    () => {
+      const range = this.calculateRange()
+
+      return [range.startIndex, range.endIndex, this.isScrolling]
+    },
     () => {
       this.notify()
     },
     {
       key: process.env.NODE_ENV !== 'production' && 'maybeNotify',
       debug: () => this.options.debug,
-      initialDeps: [...Object.values(this.range), this.isScrolling],
+      initialDeps: [
+        this.range.startIndex,
+        this.range.endIndex,
+        this.isScrolling,
+      ],
     },
   )
 

diff --git a/packages/virtual-core/src/utils.ts b/packages/virtual-core/src/utils.ts
@@ -6,7 +6,7 @@ export function memo<TDeps extends readonly any[], TResult>(
   getDeps: () => [...TDeps],
   fn: (...args: NoInfer<[...TDeps]>) => TResult,
   opts: {
-    key: any
+    key: false | string
     debug?: () => any
     onChange?: (result: TResult) => void
     initialDeps?: TDeps