From 26896482e98d17ecfaa88e88e136894cea9c4a21 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9C=88=E8=90=BD=E9=9F=B3=E9=98=91?= <424532913@qq.com>
Date: Mon, 21 Jun 2021 20:08:20 +0800
Subject: [PATCH] fix(vue): fix unmount a field in a wrong lifecycle
 function.(#1609) (#1611)

---
 packages/vue/src/hooks/useAttach.ts | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/packages/vue/src/hooks/useAttach.ts b/packages/vue/src/hooks/useAttach.ts
index 2ff8121faf4..bff3bd5b0c8 100644
--- a/packages/vue/src/hooks/useAttach.ts
+++ b/packages/vue/src/hooks/useAttach.ts
@@ -1,4 +1,4 @@
-import { onBeforeMount, onMounted, Ref, shallowRef, watch } from 'vue-demi'
+import { onBeforeUnmount, onMounted, Ref, shallowRef, watch } from 'vue-demi'
 
 interface IRecycleTarget {
   onMount: () => void
@@ -17,21 +17,24 @@ export const useAttach = <T extends IRecycleTarget>(
     target.onMount()
   })
 
-  onBeforeMount(() => {
+  onBeforeUnmount(() => {
     oldTargetRef.value?.onUnmount()
   })
 
   watch(dependencies, (cur, prev, onInvalidate) => {
     const target = creator()
-    if (oldTargetRef.value && target !== oldTargetRef.value) {
-      oldTargetRef.value.onUnmount()
-    }
-    oldTargetRef.value = target
-    target.onMount()
 
-    onInvalidate(() => {
-      oldTargetRef.value?.onUnmount()
-    })
+    if (target !== oldTargetRef.value) {
+      if (oldTargetRef.value) {
+        oldTargetRef.value.onUnmount()
+      }
+      oldTargetRef.value = target
+      target.onMount()
+
+      onInvalidate(() => {
+        oldTargetRef.value?.onUnmount()
+      })
+    }
   })
 
   return oldTargetRef