fix(compiler-core): fix for :key shorthand patchflag

close vuejs#10882
Doctor-wu · May 14, 2024 · 8e64765 · 8e64765
1 parent 107e614
commit 8e64765
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/packages/compiler-core/__tests__/transforms/vFor.spec.ts b/packages/compiler-core/__tests__/transforms/vFor.spec.ts
@@ -18,7 +18,7 @@ import {
 import { ErrorCodes } from '../../src/errors'
 import { type CompilerOptions, generate } from '../../src'
 import { FRAGMENT, RENDER_LIST, RENDER_SLOT } from '../../src/runtimeHelpers'
-import { PatchFlags } from '@vue/shared'
+import { PatchFlagNames, PatchFlags } from '@vue/shared'
 import { createObjectMatcher, genFlagText } from '../testUtils'
 
 export function parseWithForTransform(
@@ -658,6 +658,15 @@ describe('compiler: v-for', () => {
  }),
  })
  })
+
+ test('template v-for key w/ :key shorthand', () => {
+ const {
+ node: { codegenNode },
+ } = parseWithForTransform('<div v-for="key in keys" :key>test</div>')
+ expect(codegenNode.patchFlag).toBe(
+ `${PatchFlags.KEYED_FRAGMENT} /* ${PatchFlagNames[PatchFlags.KEYED_FRAGMENT]} */`,
+ )
+ })
  })
 
  describe('codegen', () => {

diff --git a/packages/compiler-core/src/transforms/vFor.ts b/packages/compiler-core/src/transforms/vFor.ts
@@ -60,7 +60,8 @@ export const transformFor = createStructuralDirectiveTransform(
  ]) as ForRenderListExpression
  const isTemplate = isTemplateNode(node)
  const memo = findDir(node, 'memo')
- const keyProp = findProp(node, `key`)
+ // allowEmpty for check shorthand
+ const keyProp = findProp(node, `key`, false, true)
  const keyExp =
  keyProp &&
  (keyProp.type === NodeTypes.ATTRIBUTE