Skip to content

Commit 9f55e6f

Browse files
authored
fix(compiler-core): handle v-memo in template v-for (#5291)
fix #5288
1 parent b2bac9f commit 9f55e6f

File tree

2 files changed

+19
-17
lines changed

2 files changed

+19
-17
lines changed

packages/compiler-core/__tests__/transforms/__snapshots__/vMemo.spec.ts.snap

+1-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ exports[`compiler: v-memo transform on template v-for 1`] = `
3636
export function render(_ctx, _cache) {
3737
return (_openBlock(), _createElementBlock(\\"div\\", null, [
3838
(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.list, ({ x, y }, __, ___, _cached) => {
39-
const _memo = ([x, y === z])
39+
const _memo = ([x, y === _ctx.z])
4040
if (_cached && _cached.key === x && _isMemoSame(_cached, _memo)) return _cached
4141
const _item = (_openBlock(), _createElementBlock(\\"span\\", { key: x }, \\"foobar\\"))
4242
_item.memo = _memo

packages/compiler-core/src/transforms/vFor.ts

+18-16
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@ export const transformFor = createStructuralDirectiveTransform(
5959
const renderExp = createCallExpression(helper(RENDER_LIST), [
6060
forNode.source
6161
]) as ForRenderListExpression
62+
const isTemplate = isTemplateNode(node)
6263
const memo = findDir(node, 'memo')
6364
const keyProp = findProp(node, `key`)
6465
const keyExp =
@@ -68,21 +69,23 @@ export const transformFor = createStructuralDirectiveTransform(
6869
: keyProp.exp!)
6970
const keyProperty = keyProp ? createObjectProperty(`key`, keyExp!) : null
7071

71-
if (
72-
!__BROWSER__ &&
73-
context.prefixIdentifiers &&
74-
keyProperty &&
75-
keyProp!.type !== NodeTypes.ATTRIBUTE
76-
) {
77-
// #2085 process :key expression needs to be processed in order for it
78-
// to behave consistently for <template v-for> and <div v-for>.
79-
// In the case of `<template v-for>`, the node is discarded and never
80-
// traversed so its key expression won't be processed by the normal
81-
// transforms.
82-
keyProperty.value = processExpression(
83-
keyProperty.value as SimpleExpressionNode,
84-
context
85-
)
72+
if (!__BROWSER__ && isTemplate) {
73+
// #2085 / #5288 process :key and v-memo expressions need to be
74+
// processed on `<template v-for>`. In this case the node is discarded
75+
// and never traversed so its binding expressions won't be processed
76+
// by the normal transforms.
77+
if (memo) {
78+
memo.exp = processExpression(
79+
memo.exp! as SimpleExpressionNode,
80+
context
81+
)
82+
}
83+
if (keyProperty && keyProp!.type !== NodeTypes.ATTRIBUTE) {
84+
keyProperty.value = processExpression(
85+
keyProperty.value as SimpleExpressionNode,
86+
context
87+
)
88+
}
8689
}
8790

8891
const isStableFragment =
@@ -112,7 +115,6 @@ export const transformFor = createStructuralDirectiveTransform(
112115
return () => {
113116
// finish the codegen now that all children have been traversed
114117
let childBlock: BlockCodegenNode
115-
const isTemplate = isTemplateNode(node)
116118
const { children } = forNode
117119

118120
// check <template v-for> key placement

0 commit comments

Comments
 (0)