From de99cb69c0f7886e62a16b0d48cf51ecd226079e Mon Sep 17 00:00:00 2001
From: zkwolf <chenhao5866@gmail.com>
Date: Wed, 21 Apr 2021 10:47:42 +0800
Subject: [PATCH] fix: virtual-list height reactive

---
 components/vc-virtual-list/List.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/components/vc-virtual-list/List.tsx b/components/vc-virtual-list/List.tsx
index fd0317ebe9..65a732f1a6 100644
--- a/components/vc-virtual-list/List.tsx
+++ b/components/vc-virtual-list/List.tsx
@@ -134,10 +134,11 @@ const List = defineComponent({
 
     // ================================ Height ================================
     const [setInstance, collectHeight, heights] = useHeights(getKey, null, null);
-    // ========================== Visible Calculation =========================
-    const calRes = computed(() => {
+
+    const calRes = ref();
+    watchEffect(() => {
       if (!useVirtual.value) {
-        return {
+        calRes.value = {
           scrollHeight: undefined,
           start: 0,
           end: state.mergedData.length - 1,
@@ -147,7 +148,7 @@ const List = defineComponent({
 
       // Always use virtual scroll bar in avoid shaking
       if (!inVirtual.value) {
-        return {
+        calRes.value = {
           scrollHeight: fillerInnerRef.value?.offsetHeight || 0,
           start: 0,
           end: state.mergedData.length - 1,
@@ -193,13 +194,14 @@ const List = defineComponent({
 
       // Give cache to improve scroll experience
       endIndex = Math.min(endIndex + 1, state.mergedData.length);
-      return {
+      calRes.value = {
         scrollHeight: itemTop,
         start: startIndex,
         end: endIndex,
         offset: startOffset,
       };
     });
+
     // =============================== In Range ===============================
     const maxScrollHeight = computed(() => calRes.value.scrollHeight! - props.height!);