From 2b6a605ee7a25faaac118cf97562320baddfecdd Mon Sep 17 00:00:00 2001
From: novlan1 <1576271227@qq.com>
Date: Wed, 27 Nov 2024 09:36:51 +0800
Subject: [PATCH] =?UTF-8?q?feat(poup):=20mounted=E5=90=8E=E6=89=8D?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=EF=BC=8C=E9=81=BF=E5=85=8Dssr=E4=B8=8Bmismat?=
 =?UTF-8?q?ch?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix #1518
---
 src/popup/popup.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/popup/popup.tsx b/src/popup/popup.tsx
index 078144afc..77fe5ac37 100644
--- a/src/popup/popup.tsx
+++ b/src/popup/popup.tsx
@@ -1,4 +1,4 @@
-import { computed, watch, defineComponent, h, ref, nextTick, Teleport, Transition } from 'vue';
+import { computed, watch, defineComponent, h, Fragment, ref, nextTick, Teleport, Transition, onMounted } from 'vue';
 import { CloseIcon } from 'tdesign-icons-vue-next';
 
 import popupProps from './props';
@@ -37,6 +37,11 @@ export default defineComponent({
 
     const wrapperVisible = ref(currentVisible.value);
     const innerVisible = ref(currentVisible.value);
+    const mounted = ref(false);
+
+    onMounted(() => {
+      mounted.value = true;
+    });
 
     // 因为开启 destroyOnClose，会影响 transition 的动画，因此需要前后设置 visible
     watch(currentVisible, (v) => {
@@ -143,11 +148,16 @@ export default defineComponent({
         </Transition>
       );
 
-      const renderPopupContent = (
+      const renderPopupContent = mounted.value ? (
         <Teleport to={teleportElement.value} disabled={!teleportElement.value}>
           {renderOverlayContent}
           {renderContent}
         </Teleport>
+      ) : (
+        <Fragment>
+          {renderOverlayContent}
+          {renderContent}
+        </Fragment>
       );
 
       return (!props.destroyOnClose || wrapperVisible.value) && renderPopupContent;