From 87c72ae49a315a5464dd0c6b00f07163d1cb39e9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?= Date: Mon, 14 Nov 2022 15:21:29 +0800 Subject: [PATCH] fix(v-model): ensure v-model listener casing is consistent with manual v-on listener (#7067) fix #7066 --- .../__tests__/transforms/__snapshots__/vModel.spec.ts.snap | 6 +++--- packages/compiler-core/__tests__/transforms/vModel.spec.ts | 6 +++--- packages/compiler-core/src/transforms/vModel.ts | 3 ++- 3 files changed, 8 insertions(+), 7 deletions(-) diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/vModel.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/vModel.spec.ts.snap index 42974581f60..8cc085572af 100644 --- a/packages/compiler-core/__tests__/transforms/__snapshots__/vModel.spec.ts.snap +++ b/packages/compiler-core/__tests__/transforms/__snapshots__/vModel.spec.ts.snap @@ -83,9 +83,9 @@ return function render(_ctx, _cache) { const { openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue return (_openBlock(), _createElementBlock(\\"input\\", { - value: model, - \\"onUpdate:value\\": $event => ((model) = $event) - }, null, 40 /* PROPS, HYDRATE_EVENTS */, [\\"value\\", \\"onUpdate:value\\"])) + \\"foo-value\\": model, + \\"onUpdate:fooValue\\": $event => ((model) = $event) + }, null, 40 /* PROPS, HYDRATE_EVENTS */, [\\"foo-value\\", \\"onUpdate:fooValue\\"])) } }" `; diff --git a/packages/compiler-core/__tests__/transforms/vModel.spec.ts b/packages/compiler-core/__tests__/transforms/vModel.spec.ts index b4b8c33cda6..808fb94215e 100644 --- a/packages/compiler-core/__tests__/transforms/vModel.spec.ts +++ b/packages/compiler-core/__tests__/transforms/vModel.spec.ts @@ -253,13 +253,13 @@ describe('compiler: transform v-model', () => { }) test('with argument', () => { - const root = parseWithVModel('') + const root = parseWithVModel('') const node = root.children[0] as ElementNode const props = ((node.codegenNode as VNodeCall).props as ObjectExpression) .properties expect(props[0]).toMatchObject({ key: { - content: 'value', + content: 'foo-value', isStatic: true }, value: { @@ -270,7 +270,7 @@ describe('compiler: transform v-model', () => { expect(props[1]).toMatchObject({ key: { - content: 'onUpdate:value', + content: 'onUpdate:fooValue', isStatic: true }, value: { diff --git a/packages/compiler-core/src/transforms/vModel.ts b/packages/compiler-core/src/transforms/vModel.ts index bf5e69beb2c..3f13f327098 100644 --- a/packages/compiler-core/src/transforms/vModel.ts +++ b/packages/compiler-core/src/transforms/vModel.ts @@ -18,6 +18,7 @@ import { } from '../utils' import { IS_REF } from '../runtimeHelpers' import { BindingTypes } from '../options' +import { camelize } from '@vue/shared' export const transformModel: DirectiveTransform = (dir, node, context) => { const { exp, arg } = dir @@ -77,7 +78,7 @@ export const transformModel: DirectiveTransform = (dir, node, context) => { const propName = arg ? arg : createSimpleExpression('modelValue', true) const eventName = arg ? isStaticExp(arg) - ? `onUpdate:${arg.content}` + ? `onUpdate:${camelize(arg.content)}` : createCompoundExpression(['"onUpdate:" + ', arg]) : `onUpdate:modelValue`