Skip to content

Commit 9b6ecde

Browse files
committed
fix(runtime-core): handle KeepAlive children unmount when wrapped in stable v-for
1 parent 5e776ae commit 9b6ecde

File tree

2 files changed

+50
-1
lines changed

2 files changed

+50
-1
lines changed

packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import {
22
Fragment,
33
type FunctionalComponent,
4+
KeepAlive,
45
type SetupContext,
56
Teleport,
67
type TestElement,
78
type VNode,
9+
computed,
810
createApp,
911
createBlock,
1012
createCommentVNode,
@@ -1294,4 +1296,51 @@ describe('renderer: optimized mode', () => {
12941296
expect(inner(root)).toBe('<!--v-if-->')
12951297
expect(beforeUnmountSpy).toHaveBeenCalledTimes(1)
12961298
})
1299+
1300+
//#12914
1301+
test('unmount KeepAlive children when wrapped in v-for with stable fragment', async () => {
1302+
const CompA = {
1303+
setup() {
1304+
return () => h('span', 'CompA')
1305+
},
1306+
}
1307+
const CompB = {
1308+
setup() {
1309+
return () => h('span', 'CompB')
1310+
},
1311+
}
1312+
1313+
const toggle = ref(true)
1314+
const view = computed(() => {
1315+
return toggle.value ? CompA : CompB
1316+
})
1317+
1318+
const app = createApp({
1319+
render() {
1320+
return (
1321+
openBlock(),
1322+
createElementBlock(
1323+
Fragment,
1324+
null,
1325+
renderList(1, () => {
1326+
return createVNode(
1327+
KeepAlive,
1328+
null,
1329+
[(openBlock(), createBlock(view.value))],
1330+
1024 /* DYNAMIC_SLOTS */,
1331+
)
1332+
}),
1333+
64 /* STABLE_FRAGMENT */,
1334+
)
1335+
)
1336+
},
1337+
})
1338+
1339+
app.mount(root)
1340+
expect(inner(root)).toBe('<span>CompA</span>')
1341+
1342+
toggle.value = false
1343+
await nextTick()
1344+
expect(inner(root)).toBe('<span>CompB</span>')
1345+
})
12971346
})

packages/runtime-core/src/renderer.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2107,7 +2107,7 @@ function baseCreateRenderer(
21072107
}
21082108

21092109
if (shapeFlag & ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE) {
2110-
;(parentComponent!.ctx as KeepAliveContext).deactivate(vnode)
2110+
;(vnode.component!.parent!.ctx as KeepAliveContext).deactivate(vnode)
21112111
return
21122112
}
21132113

0 commit comments

Comments
 (0)