root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 13 Packages Projects Releases Wiki Activity

fix: use modelValueModifiers intead of modelModifiers

This commit is contained in:
zhiyuanzmj 2025-03-19 17:59:02 +08:00
parent 2696f14e1c
commit 8b7a035d14
7 changed files with 26 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/compiler-core/__tests__/transforms/vModel.spec.ts
View File

@ -449,7 +449,7 @@ describe('compiler: transform v-model', () => {
expect(codegen.dynamicProps).toBe(`["modelValue", "onUpdate:modelValue"]`) expect(codegen.dynamicProps).toBe(`["modelValue", "onUpdate:modelValue"]`)
}) })
test('should generate modelModifiers for component v-model', () => { test('should generate modelValueModifiers for component v-model', () => {
const root = parseWithVModel('<Comp v-model.trim.bar-baz="foo" />', { const root = parseWithVModel('<Comp v-model.trim.bar-baz="foo" />', {
prefixIdentifiers: true, prefixIdentifiers: true,
}) })
@ -461,7 +461,7 @@ describe('compiler: transform v-model', () => {
{ key: { content: `modelValue` } }, { key: { content: `modelValue` } },
{ key: { content: `onUpdate:modelValue` } }, { key: { content: `onUpdate:modelValue` } },
{ {
key: { content: 'modelModifiers' }, key: { content: 'modelValueModifiers' },
value: { value: {
content: `{ trim: true, "bar-baz": true }`, content: `{ trim: true, "bar-baz": true }`,
isStatic: false, isStatic: false,
@ -469,7 +469,7 @@ describe('compiler: transform v-model', () => {
}, },
], ],
}) })
// should NOT include modelModifiers in dynamicPropNames because it's never // should NOT include modelValueModifiers in dynamicPropNames because it's never
// gonna change // gonna change
expect(vnodeCall.dynamicProps).toBe(`["modelValue", "onUpdate:modelValue"]`) expect(vnodeCall.dynamicProps).toBe(`["modelValue", "onUpdate:modelValue"]`)
}) })

2
packages/compiler-core/src/transforms/vModel.ts
View File

@ -138,7 +138,7 @@ export const transformModel: DirectiveTransform = (dir, node, context) => {
? isStaticExp(arg) ? isStaticExp(arg)
? `${arg.content}Modifiers` ? `${arg.content}Modifiers`
: createCompoundExpression([arg, ' + "Modifiers"']) : createCompoundExpression([arg, ' + "Modifiers"'])
: `modelModifiers` : `modelValueModifiers`
props.push( props.push(
createObjectProperty( createObjectProperty(
modifiersKey, modifiersKey,

20
packages/compiler-sfc/__tests__/compileScript/__snapshots__/defineModel.spec.ts.snap
View File

@ -6,7 +6,7 @@ exports[`defineModel() > basic usage 1`] = `
export default { export default {
props: { props: {
"modelValue": { required: true }, "modelValue": { required: true },
"modelModifiers": {}, "modelValueModifiers": {},
"count": {}, "count": {},
"countModifiers": {}, "countModifiers": {},
"toString": { type: Function }, "toString": { type: Function },
@ -34,7 +34,7 @@ export default /*@__PURE__*/_defineComponent({
"modelValue": { "modelValue": {
required: true required: true
}, },
"modelModifiers": {}, "modelValueModifiers": {},
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {
@ -60,7 +60,7 @@ export default /*@__PURE__*/_defineComponent({
default: 0, default: 0,
required: true, required: true,
}, },
"modelModifiers": {}, "modelValueModifiers": {},
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {
@ -86,7 +86,7 @@ export default /*@__PURE__*/_defineComponent({
}, { }, {
"modelValue": { "modelValue": {
}, },
"modelModifiers": {}, "modelValueModifiers": {},
}), }),
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props: any, { expose: __expose }) { setup(__props: any, { expose: __expose }) {
@ -109,7 +109,7 @@ exports[`defineModel() > w/ Boolean And Function types, production mode 1`] = `
export default /*@__PURE__*/_defineComponent({ export default /*@__PURE__*/_defineComponent({
props: { props: {
"modelValue": { type: [Boolean, String] }, "modelValue": { type: [Boolean, String] },
"modelModifiers": {}, "modelValueModifiers": {},
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {
@ -150,7 +150,7 @@ exports[`defineModel() > w/ defineProps and defineEmits 1`] = `
export default { export default {
props: /*@__PURE__*/_mergeModels({ foo: String }, { props: /*@__PURE__*/_mergeModels({ foo: String }, {
"modelValue": { default: 0 }, "modelValue": { default: 0 },
"modelModifiers": {}, "modelValueModifiers": {},
}), }),
emits: /*@__PURE__*/_mergeModels(['change'], ["update:modelValue"]), emits: /*@__PURE__*/_mergeModels(['change'], ["update:modelValue"]),
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {
@ -172,7 +172,7 @@ exports[`defineModel() > w/ types, basic usage 1`] = `
export default /*@__PURE__*/_defineComponent({ export default /*@__PURE__*/_defineComponent({
props: { props: {
"modelValue": { type: [Boolean, String] }, "modelValue": { type: [Boolean, String] },
"modelModifiers": {}, "modelValueModifiers": {},
"count": { type: Number }, "count": { type: Number },
"countModifiers": {}, "countModifiers": {},
"disabled": { type: Number, ...{ required: false } }, "disabled": { type: Number, ...{ required: false } },
@ -201,7 +201,7 @@ exports[`defineModel() > w/ types, production mode 1`] = `
export default /*@__PURE__*/_defineComponent({ export default /*@__PURE__*/_defineComponent({
props: { props: {
"modelValue": { type: Boolean }, "modelValue": { type: Boolean },
"modelModifiers": {}, "modelValueModifiers": {},
"fn": {}, "fn": {},
"fnModifiers": {}, "fnModifiers": {},
"fnWithDefault": { type: Function, ...{ default: () => null } }, "fnWithDefault": { type: Function, ...{ default: () => null } },
@ -233,7 +233,7 @@ exports[`defineModel() > w/ types, production mode, boolean + multiple types 1`]
export default /*@__PURE__*/_defineComponent({ export default /*@__PURE__*/_defineComponent({
props: { props: {
"modelValue": { type: [Boolean, String, Object] }, "modelValue": { type: [Boolean, String, Object] },
"modelModifiers": {}, "modelValueModifiers": {},
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {
@ -253,7 +253,7 @@ exports[`defineModel() > w/ types, production mode, function + runtime opts + mu
export default /*@__PURE__*/_defineComponent({ export default /*@__PURE__*/_defineComponent({
props: { props: {
"modelValue": { type: [Number, Function], ...{ default: () => 1 } }, "modelValue": { type: [Number, Function], ...{ default: () => 1 } },
"modelModifiers": {}, "modelValueModifiers": {},
}, },
emits: ["update:modelValue"], emits: ["update:modelValue"],
setup(__props, { expose: __expose }) { setup(__props, { expose: __expose }) {

2
packages/compiler-sfc/__tests__/compileScript/defineModel.spec.ts
View File

@ -94,7 +94,7 @@ describe('defineModel()', () => {
) )
assertCode(content) assertCode(content)
expect(content).toMatch('"modelValue": { type: [Boolean, String] }') expect(content).toMatch('"modelValue": { type: [Boolean, String] }')
expect(content).toMatch('"modelModifiers": {}') expect(content).toMatch('"modelValueModifiers": {}')
expect(content).toMatch('"count": { type: Number }') expect(content).toMatch('"count": { type: Number }')
expect(content).toMatch( expect(content).toMatch(
'"disabled": { type: Number, ...{ required: false } }', '"disabled": { type: Number, ...{ required: false } }',

4
packages/compiler-sfc/src/script/defineModel.ts
View File

@ -167,9 +167,7 @@ export function genModelProps(ctx: ScriptCompileContext) {
modelPropsDecl += `\n ${JSON.stringify(name)}: ${decl},` modelPropsDecl += `\n ${JSON.stringify(name)}: ${decl},`
// also generate modifiers prop // also generate modifiers prop
const modifierPropName = JSON.stringify( const modifierPropName = JSON.stringify(`${name}Modifiers`)
name === 'modelValue' ? `modelModifiers` : `${name}Modifiers`,
)
modelPropsDecl += `\n ${modifierPropName}: {},` modelPropsDecl += `\n ${modifierPropName}: {},`
} }
return `{${modelPropsDecl}\n }` return `{${modelPropsDecl}\n }`

10
packages/runtime-core/__tests__/componentEmits.spec.ts
View File

@ -325,7 +325,7 @@ describe('component: emit', () => {
const Comp = () => const Comp = () =>
h(Foo, { h(Foo, {
modelValue: null, modelValue: null,
modelModifiers: { number: true }, modelValueModifiers: { number: true },
'onUpdate:modelValue': fn1, 'onUpdate:modelValue': fn1,
foo: null, foo: null,
@ -356,7 +356,7 @@ describe('component: emit', () => {
const Comp = () => const Comp = () =>
h(Foo, { h(Foo, {
modelValue: null, modelValue: null,
modelModifiers: { trim: true }, modelValueModifiers: { trim: true },
'onUpdate:modelValue': fn1, 'onUpdate:modelValue': fn1,
foo: null, foo: null,
@ -410,7 +410,7 @@ describe('component: emit', () => {
const Comp = () => const Comp = () =>
h(Foo, { h(Foo, {
modelValue: null, modelValue: null,
modelModifiers: { trim: true }, modelValueModifiers: { trim: true },
'onUpdate:modelValue': fn1, 'onUpdate:modelValue': fn1,
firstName: null, firstName: null,
@ -464,7 +464,7 @@ describe('component: emit', () => {
const Comp = () => const Comp = () =>
h(Foo, { h(Foo, {
modelValue: null, modelValue: null,
modelModifiers: { trim: true, number: true }, modelValueModifiers: { trim: true, number: true },
'onUpdate:modelValue': fn1, 'onUpdate:modelValue': fn1,
foo: null, foo: null,
@ -492,7 +492,7 @@ describe('component: emit', () => {
const Comp = () => const Comp = () =>
h(Foo, { h(Foo, {
modelValue: null, modelValue: null,
modelModifiers: { trim: true }, modelValueModifiers: { trim: true },
'onUpdate:modelValue': fn, 'onUpdate:modelValue': fn,
}) })

10
packages/runtime-core/src/helpers/useModel.ts
View File

@ -145,9 +145,9 @@ export const getModelModifiers = (
modelName: string, modelName: string,
getter: (props: Record<string, any>, key: string) => any, getter: (props: Record<string, any>, key: string) => any,
): Record<string, boolean> | undefined => { ): Record<string, boolean> | undefined => {
return modelName === 'modelValue' || modelName === 'model-value' return (
? getter(props, 'modelModifiers') getter(props, `${modelName}Modifiers`) ||
: getter(props, `${modelName}Modifiers`) || getter(props, `${camelize(modelName)}Modifiers`) ||
getter(props, `${camelize(modelName)}Modifiers`) || getter(props, `${hyphenate(modelName)}Modifiers`)
getter(props, `${hyphenate(modelName)}Modifiers`) )
} }