From e12ad9ef4d58aa72e21d72303dc340d4941e804c Mon Sep 17 00:00:00 2001
From: Xwite <1797350009@qq.com>
Date: Thu, 11 May 2023 14:41:29 +0800
Subject: [PATCH] =?UTF-8?q?web:=20=E5=87=8F=E5=B0=91=E9=87=8D=E7=BB=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 modules/web/src/components/PopCatalog.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/modules/web/src/components/PopCatalog.vue b/modules/web/src/components/PopCatalog.vue
index c440f29ef..d33ad5bb7 100644
--- a/modules/web/src/components/PopCatalog.vue
+++ b/modules/web/src/components/PopCatalog.vue
@@ -1,8 +1,5 @@
 <template>
-  <div
-    :class="{ 'cata-wrapper': true, visible: popCataVisible }"
-    :style="popupTheme"
-  >
+  <div :class="{ 'cata-wrapper': true, correctSize }" :style="popupTheme">
     <div class="title">目录</div>
     <virtual-list
       style="height: 300px; overflow: auto"
@@ -77,9 +74,12 @@ const virtualListIndex = computed(() => {
   return Math.floor(index.value / 2);
 });
 
-onUpdated(() => {
-  // dom更新触发ResizeObserver，更新虚拟列表内部的sizes Map
-  virtualListRef.value.scrollToIndex(virtualListIndex.value);
+const correctSize = ref(false);
+watch(popCataVisible, (visible) => {
+  // 组件挂载时不可见 virtualList计算首屏的size为0 重新触发其内部的ResizeObserver
+  if (visible && !correctSize.value) correctSize.value = true
+  if (!visible) return;
+  nextTick(() => virtualListRef.value.scrollToIndex(virtualListIndex.value));
 });
 </script>