diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/vFor.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/vFor.spec.ts.snap index 2e12ad16..aa98188d 100644 --- a/packages/compiler-core/__tests__/transforms/__snapshots__/vFor.spec.ts.snap +++ b/packages/compiler-core/__tests__/transforms/__snapshots__/vFor.spec.ts.snap @@ -104,6 +104,23 @@ return function render(_ctx, _cache) { }" `; +exports[`compiler: v-for codegen template v-for key injection with single child 1`] = ` +"const _Vue = Vue + +return function render(_ctx, _cache) { + with (_ctx) { + const { renderList: _renderList, Fragment: _Fragment, openBlock: _openBlock, createBlock: _createBlock, createVNode: _createVNode } = _Vue + + return (_openBlock(true), _createBlock(_Fragment, null, _renderList(items, (item) => { + return (_openBlock(), _createBlock(\\"span\\", { + key: item.id, + id: item.id + }, null, 8 /* PROPS */, [\\"id\\"])) + }), 128 /* KEYED_FRAGMENT */)) + } +}" +`; + exports[`compiler: v-for codegen template v-for w/ 1`] = ` "const _Vue = Vue diff --git a/packages/compiler-core/__tests__/transforms/vFor.spec.ts b/packages/compiler-core/__tests__/transforms/vFor.spec.ts index b8d6b3b3..1fc19c90 100644 --- a/packages/compiler-core/__tests__/transforms/vFor.spec.ts +++ b/packages/compiler-core/__tests__/transforms/vFor.spec.ts @@ -770,6 +770,29 @@ describe('compiler: v-for', () => { expect(generate(root).code).toMatchSnapshot() }) + // #1907 + test('template v-for key injection with single child', () => { + const { + root, + node: { codegenNode } + } = parseWithForTransform( + '' + ) + expect(assertSharedCodegen(codegenNode, true)).toMatchObject({ + source: { content: `items` }, + params: [{ content: `item` }], + innerVNodeCall: { + type: NodeTypes.VNODE_CALL, + tag: `"span"`, + props: createObjectMatcher({ + key: '[item.id]', + id: '[item.id]' + }) + } + }) + expect(generate(root).code).toMatchSnapshot() + }) + test('v-for on ', () => { const { root, diff --git a/packages/compiler-core/src/transforms/vFor.ts b/packages/compiler-core/src/transforms/vFor.ts index 8ce821f9..99ab9104 100644 --- a/packages/compiler-core/src/transforms/vFor.ts +++ b/packages/compiler-core/src/transforms/vFor.ts @@ -145,6 +145,9 @@ export const transformFor = createStructuralDirectiveTransform( // but mark it as a block. childBlock = (children[0] as PlainElementNode) .codegenNode as VNodeCall + if (isTemplate && keyProperty) { + injectProp(childBlock, keyProperty, context) + } childBlock.isBlock = !isStableFragment if (childBlock.isBlock) { helper(OPEN_BLOCK)