fix: avoid other bugs

zhangzhonghe · Apr 23, 2023 · 499a7c3 · 499a7c3
1 parent 7e1d2d4
commit 499a7c3
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 14 deletions.
diff --git a/packages/runtime-core/__tests__/components/KeepAlive.spec.ts b/packages/runtime-core/__tests__/components/KeepAlive.spec.ts
@@ -887,6 +887,7 @@ describe('KeepAlive', () => {
   test('should invoke onActivated of child on initial mount', async () => {
     let parentCount = 0
     let childCount = 0
+    const toggle = ref(true)
     const Child = defineComponent({
       name: 'Child',
       setup() {
@@ -908,7 +909,7 @@ describe('KeepAlive', () => {
 
     const App = {
       render: () => {
-        return h(KeepAlive, null, () => h(AsyncComp))
+        return h(KeepAlive, null, () => (toggle.value ? h(AsyncComp) : null))
       }
     }
 
@@ -917,6 +918,13 @@ describe('KeepAlive', () => {
     expect(serializeInner(root)).toBe('child')
     expect(parentCount).toBe(1)
     expect(childCount).toBe(1)
+
+    toggle.value = false
+    await timeout()
+    toggle.value = true
+    await timeout()
+    expect(parentCount).toBe(2)
+    expect(childCount).toBe(2)
   })
 
   // #4976

diff --git a/packages/runtime-core/src/components/KeepAlive.ts b/packages/runtime-core/src/components/KeepAlive.ts
@@ -402,18 +402,10 @@ function registerKeepAliveHook(
   // arrays.
   if (target) {
     let current = target.parent
-    let child = target
     while (current && current.parent) {
       if (isKeepAlive(current.parent.vnode)) {
-        injectToKeepAliveRoot(
-          wrappedHook,
-          type,
-          target,
-          // #7276
-          isAsyncWrapper(current) ? child : current
-        )
+        injectToKeepAliveRoot(wrappedHook, type, target, current)
       }
-      child = current
       current = current.parent
     }
   }

diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts
@@ -1413,16 +1413,23 @@ function baseCreateRenderer(
           )
         }
 
+        const parentIsAsyncWrapperAndShouldKeepAlive =
+          parent &&
+          isAsyncWrapper(parent.vnode) &&
+          parent.vnode.shapeFlag & ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE
         // activated hook for keep-alive roots.
         // #1742 activated hook must be accessed after first render
         // since the hook may be injected by a child keep-alive
         if (
           initialVNode.shapeFlag & ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE ||
-          (parent &&
-            isAsyncWrapper(parent.vnode) &&
-            parent.vnode.shapeFlag & ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE)
+          parentIsAsyncWrapperAndShouldKeepAlive
         ) {
-          instance.a && queuePostRenderEffect(instance.a, parentSuspense)
+          if (parentIsAsyncWrapperAndShouldKeepAlive) {
+            // #7276 - parent.a contains all the hooks of the descendants
+            parent.a && queuePostRenderEffect(parent.a, parentSuspense)
+          } else {
+            instance.a && queuePostRenderEffect(instance.a, parentSuspense)
+          }
           if (
             __COMPAT__ &&
             isCompatEnabled(DeprecationTypes.INSTANCE_EVENT_HOOKS, instance)