From deb5cc24289caf445828cba8d520202dfd05864f Mon Sep 17 00:00:00 2001
From: Ayaka Rizumu <464388324@qq.com>
Date: Wed, 21 Dec 2022 22:41:27 +0800
Subject: [PATCH] fix: `ModalDialog` component has focus error in
 `:use-v-if="false"` mode. (#494)

---
 components/modal/ModalDialog.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/modal/ModalDialog.vue b/components/modal/ModalDialog.vue
index 22ab7c4d..f607f5e5 100644
--- a/components/modal/ModalDialog.vue
+++ b/components/modal/ModalDialog.vue
@@ -62,7 +62,7 @@ const elDialogMain = ref<HTMLDivElement>()
 const elDialogRoot = ref<HTMLDivElement>()
 
 const { activate } = useFocusTrap(elDialogRoot, {
-  immediate: true,
+  immediate: false,
   allowOutsideClick: true,
   clickOutsideDeactivates: true,
   escapeDeactivates: true,
@@ -137,9 +137,9 @@ export default {
 </script>
 
 <template>
-  <Teleport to="body" @transitionend="trapFocusDialog">
+  <Teleport to="body">
     <!-- Dialog component -->
-    <Transition name="dialog-visible">
+    <Transition name="dialog-visible" @transitionend="trapFocusDialog">
       <div
         v-if="isVIf"
         v-show="isVShow"