fix(vue): fix unmount a field in a wrong lifecycle function.(#1609) (#…

…1611)
alibaba · Jun 21, 2021 · 2689648 · 2689648
1 parent 3180336
commit 2689648
Showing 1 changed file with 13 additions and 10 deletions.
diff --git 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