Skip to content

Commit 0046b79

Browse files
committed
fix(keep-alive): invoke initial activated hook for async components's child component (#7276)
1 parent fe77e2b commit 0046b79

File tree

2 files changed

+45
-1
lines changed

2 files changed

+45
-1
lines changed

packages/runtime-core/__tests__/components/KeepAlive.spec.ts

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -882,6 +882,42 @@ describe('KeepAlive', () => {
882882
expect(serializeInner(root)).toBe('<p>1</p>')
883883
})
884884

885+
// #7276
886+
test('should invoke onActivated of child on initial mount', async () => {
887+
let parentCount = 0
888+
let childCount = 0
889+
const Child = defineComponent({
890+
name: 'Child',
891+
setup() {
892+
onActivated(() => {
893+
childCount++
894+
})
895+
return () => 'child'
896+
}
897+
})
898+
const Parent = defineComponent({
899+
setup() {
900+
onActivated(() => {
901+
parentCount++
902+
})
903+
return () => h(Child)
904+
}
905+
})
906+
const AsyncComp = defineAsyncComponent(() => Promise.resolve(Parent))
907+
908+
const App = {
909+
render: () => {
910+
return h(KeepAlive, null, () => h(AsyncComp))
911+
}
912+
}
913+
914+
render(h(App), root)
915+
await timeout()
916+
expect(serializeInner(root)).toBe('child')
917+
expect(parentCount).toBe(1)
918+
expect(childCount).toBe(1)
919+
})
920+
885921
// #4976
886922
test('handle error in async onActivated', async () => {
887923
const err = new Error('foo')

packages/runtime-core/src/components/KeepAlive.ts

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -401,10 +401,18 @@ function registerKeepAliveHook(
401401
// arrays.
402402
if (target) {
403403
let current = target.parent
404+
let child = target
404405
while (current && current.parent) {
405406
if (isKeepAlive(current.parent.vnode)) {
406-
injectToKeepAliveRoot(wrappedHook, type, target, current)
407+
injectToKeepAliveRoot(
408+
wrappedHook,
409+
type,
410+
target,
411+
// #7276
412+
isAsyncWrapper(current) ? child : current
413+
)
407414
}
415+
child = current
408416
current = current.parent
409417
}
410418
}

0 commit comments

Comments
 (0)