fix: scroller

components/vc-virtual-list/List.jsx

@@ -93,7 +93,7 @@ const List = {
       const alignedTop = keepInRange(value);
 
       componentRef.current.scrollTop = alignedTop;
-      return alignedTop;
+      state.scrollTop = alignedTop;
     }
 
     // ================================ Legacy ================================
@@ -105,7 +105,7 @@ const List = {
     // diffItemRef.current = diffItem;
 
     // ================================ Height ================================
-    const [setInstance, collectHeight, heights, updatedMark] = useHeights(getKey, null, null);
+    const [setInstance, collectHeight, heights] = useHeights(getKey, null, null);
 
     // ========================== Visible Calculation =========================
     const calRes = computed(() => {
@@ -117,19 +117,16 @@ const List = {
           offset: undefined,
         };
       }
-
       let itemTop = 0;
       let startIndex;
       let startOffset;
       let endIndex;
-      // eslint-disable-next-line no-console
-      console.log('updatedMark', updatedMark);
       const dataLen = state.mergedData.length;
       for (let i = 0; i < dataLen; i += 1) {
         const item = state.mergedData[i];
         const key = getKey(item);
 
-        const cacheHeight = heights.get(key);
+        const cacheHeight = heights[key];
         const currentItemBottom =
           itemTop + (cacheHeight === undefined ? props.itemHeight : cacheHeight);
 

components/vc-virtual-list/ScrollBar.jsx

@@ -68,7 +68,7 @@ export default {
     this.thumbRef.current.addEventListener('touchstart', this.onMouseDown);
   },
 
-  unmounted() {
+  beforeUnmount() {
     this.removeEvents();
     clearTimeout(this.visibleTimeout);
   },

components/vc-virtual-list/hooks/useChildren.jsx

@@ -1,23 +0,0 @@
-import { Item } from '../Item';
-
-export default function useChildren(
-  list,
-  startIndex,
-  endIndex,
-  setNodeRef,
-  renderFunc,
-  { getKey },
-) {
-  return list.slice(startIndex, endIndex + 1).map((item, index) => {
-    const eleIndex = startIndex + index;
-    const node = renderFunc(item, eleIndex, {
-      // style: status === 'MEASURE_START' ? { visibility: 'hidden' } : {},
-    });
-    const key = getKey(item);
-    return (
-      <Item key={key} setRef={ele => setNodeRef(item, ele)}>
-        {node}
-      </Item>
-    );
-  });
-}

components/vc-virtual-list/hooks/useHeights.jsx

@@ -1,16 +1,14 @@
-import { ref } from 'vue';
+import { reactive, ref } from 'vue';
 import { findDOMNode } from '../../_util/props-util';
-import CacheMap from '../utils/CacheMap';
 
 export default function useHeights(getKey, onItemAdd, onItemRemove) {
   const instance = new Map();
-  const heights = new CacheMap();
+  const heights = reactive({});
   let updatedMark = ref(0);
   let heightUpdateId = 0;
   function collectHeight() {
     heightUpdateId += 1;
     const currentId = heightUpdateId;
-
     Promise.resolve().then(() => {
       // Only collect when it's latest call
       if (currentId !== heightUpdateId) return;
@@ -19,9 +17,9 @@ export default function useHeights(getKey, onItemAdd, onItemRemove) {
         if (element && element.offsetParent) {
           const htmlElement = findDOMNode(element);
           const { offsetHeight } = htmlElement;
-          if (heights.get(key) !== offsetHeight) {
+          if (heights[key] !== offsetHeight) {
             changed = true;
-            heights.set(key, htmlElement.offsetHeight);
+            heights[key] = htmlElement.offsetHeight;
           }
         }
       });

components/vc-virtual-list/hooks/useScrollTo.jsx

@@ -50,7 +50,7 @@ export default function useScrollTo(
           for (let i = 0; i <= index; i += 1) {
             const key = getKey(data[i]);
             itemTop = stackTop;
-            const cacheHeight = heights.get(key);
+            const cacheHeight = heights[key];
             itemBottom = itemTop + (cacheHeight === undefined ? itemHeight : cacheHeight);
 
             stackTop = itemBottom;

components/vc-virtual-list/utils/CacheMap.js

@@ -1,19 +0,0 @@
-// Firefox has low performance of map.
-class CacheMap {
-  maps;
-
-  constructor() {
-    this.maps = {};
-    this.maps.prototype = null;
-  }
-
-  set(key, value) {
-    this.maps[key] = value;
-  }
-
-  get(key) {
-    return this.maps[key];
-  }
-}
-
-export default CacheMap;