fix(tree): fix blank space issue during virtual scrolling

src/hooks/useVirtualScrollNew.ts

@@ -60,12 +60,12 @@
     return tScroll.value.type === 'virtual' && tScroll.value.threshold < data.length;
   });
 
-  const getTrScrollTopHeightList = (trHeightList: number[], containerHeight: number) => {
+  const getTrScrollTopHeightList = (trHeightList: number[]) => {
     const list: number[] = [];
     const { data } = params.value;
-    // 当前行滚动高度 = 上一行滚动高度 + 当前行高度 + 容器高度
+    // 当前行滚动高度 = 上一行滚动高度 + 上一行高度
     for (let i = 0, len = data.length; i < len; i++) {
-      list[i] = (list[i - 1] || containerHeight) + (trHeightList[i] || tScroll.value.rowHeight);
+      list[i] = (list[i - 1] || 0) + (trHeightList[i - 1] || tScroll.value.rowHeight);
     }
     return list;
   };
@@ -81,13 +81,24 @@
         break;
       }
     }
-    if (currentIndex < 0) return;
-    const startIndex = Math.min(currentIndex, trScrollTopHeightList.length - tripleBufferSize.value);
-    const endIndex = startIndex + tripleBufferSize.value;
-    if (startAndEndIndex.value.join() !== [startIndex, endIndex].join() && startIndex >= 0) {
+    if (currentIndex < 0) {
+      // 处理滚动到底部的情况
+      const lastIndex = trScrollTopHeightList.length - 1;
+      if (scrollTop > trScrollTopHeightList[lastIndex]) {
+        currentIndex = lastIndex;
+      } else {
+        return;
+      }
+    }
+
+    const { bufferSize } = tScroll.value;
+    const startIndex = Math.max(0, currentIndex - bufferSize);
+    const endIndex = Math.min(trScrollTopHeightList.length, currentIndex + bufferSize * 2);
+
+    if (startAndEndIndex.value.join() !== [startIndex, endIndex].join()) {
       visibleData.value = params.value.data.slice(startIndex, endIndex);
       const lastScrollTop = trScrollTopHeightList[startIndex - 1];
-      const top = lastScrollTop > 0 ? lastScrollTop - containerHeight.value : 0;
+      const top = lastScrollTop > 0 ? lastScrollTop : 0;
       translateY.value = top;
       startAndEndIndex.value = [startIndex, endIndex];
     }
@@ -101,7 +112,7 @@
     const newTrHeightList = trHeightList.value;
     if (newTrHeightList[rowIndex] !== trHeight) {
       newTrHeightList[rowIndex] = trHeight;
-      const scrollTopHeightList = getTrScrollTopHeightList(newTrHeightList, containerHeight.value);
+      const scrollTopHeightList = getTrScrollTopHeightList(newTrHeightList);
       trScrollTopHeightList.value = scrollTopHeightList;
 
       const lastIndex = scrollTopHeightList.length - 1;
@@ -173,7 +184,7 @@
       const timer = setTimeout(() => {
         if (container.value) {
           containerHeight.value = container.value.getBoundingClientRect().height;
           const scrollTopHeightList = getTrScrollTopHeightList(trHeightList.value || [], containerHeight.value);
           trScrollTopHeightList.value = scrollTopHeightList;
         }
         clearTimeout(timer);

src/tree/tree.tsx

@@ -311,7 +311,10 @@ export default defineComponent({
       );
     }
 
-    const topValue = (allNodes.value?.filter((node) => node.visible).length ?? 0) * (refProps.scroll.value?.rowHeight ?? 34);
+    const visibleNodeCount = allNodes.value?.filter((node) => node.visible).length ?? 0;
+    const topValue = isVirtual
+      ? virtualConfig.scrollHeight.value + (refProps.scroll.value?.rowHeight ?? 34) * 2
+      : visibleNodeCount * (refProps.scroll.value?.rowHeight ?? 34);
     const placeholderStyles: TypeStyles = {
       width: '1px',
       height: '1px',

test/snap/__snapshots__/csr.test.js.snap

@@ -144554,7 +144554,7 @@ exports[`csr snapshot test > csr test ./src/tree/_example/vscroll.vue 1`] = `
         </div>
       </div>
       <div
-        style="width: 1px; height: 1px; opacity: 0; pointer-events: none; position: absolute; left: 0px; top: 5270px;"
+        style="width: 1px; height: 1px; opacity: 0; pointer-events: none; position: absolute; left: 0px; top: 68px;"
       />
     </div>
   </div>