vuejs · zhiyuanzmj · Mar 19, 2025 · Mar 20, 2025
diff --git a/packages/compiler-core/__tests__/transforms/vModel.spec.ts b/packages/compiler-core/__tests__/transforms/vModel.spec.ts
@@ -449,7 +449,7 @@ describe('compiler: transform v-model', () => {
     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" />', {
       prefixIdentifiers: true,
     })
@@ -461,15 +461,15 @@ describe('compiler: transform v-model', () => {
         { key: { content: `modelValue` } },
         { key: { content: `onUpdate:modelValue` } },
         {
-          key: { content: 'modelModifiers' },
+          key: { content: 'modelValueModifiers' },
           value: {
             content: `{ trim: true, "bar-baz": true }`,
             isStatic: false,
           },
         },
       ],
     })
-    // should NOT include modelModifiers in dynamicPropNames because it's never
+    // should NOT include modelValueModifiers in dynamicPropNames because it's never
     // gonna change
     expect(vnodeCall.dynamicProps).toBe(`["modelValue", "onUpdate:modelValue"]`)
   })

diff --git a/packages/compiler-core/src/transforms/vModel.ts b/packages/compiler-core/src/transforms/vModel.ts
@@ -138,7 +138,7 @@ export const transformModel: DirectiveTransform = (dir, node, context) => {
       ? isStaticExp(arg)
         ? `${arg.content}Modifiers`
         : createCompoundExpression([arg, ' + "Modifiers"'])
-      : `modelModifiers`
+      : `modelValueModifiers`
     props.push(
       createObjectProperty(
         modifiersKey,

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

diff --git a/packages/compiler-sfc/__tests__/compileScript/defineModel.spec.ts b/packages/compiler-sfc/__tests__/compileScript/defineModel.spec.ts
@@ -94,7 +94,7 @@ describe('defineModel()', () => {
     )
     assertCode(content)
     expect(content).toMatch('"modelValue": { type: [Boolean, String] }')
-    expect(content).toMatch('"modelModifiers": {}')
+    expect(content).toMatch('"modelValueModifiers": {}')
     expect(content).toMatch('"count": { type: Number }')
     expect(content).toMatch(
       '"disabled": { type: Number, ...{ required: false } }',

diff --git a/packages/compiler-sfc/src/script/defineModel.ts b/packages/compiler-sfc/src/script/defineModel.ts
@@ -167,9 +167,7 @@ export function genModelProps(ctx: ScriptCompileContext) {
     modelPropsDecl += `\n    ${JSON.stringify(name)}: ${decl},`
 
     // also generate modifiers prop
-    const modifierPropName = JSON.stringify(
-      name === 'modelValue' ? `modelModifiers` : `${name}Modifiers`,
-    )
+    const modifierPropName = JSON.stringify(`${name}Modifiers`)
     modelPropsDecl += `\n    ${modifierPropName}: {},`
   }
   return `{${modelPropsDecl}\n  }`

diff --git a/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap b/packages/compiler-vapor/__tests__/transforms/__snapshots__/vModel.spec.ts.snap
@@ -1,13 +1,13 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`compiler: vModel transform > component > v-model for component should generate modelModifiers 1`] = `
+exports[`compiler: vModel transform > component > v-model for component should generate modelValueModifiers 1`] = `
 "import { resolveComponent as _resolveComponent, createComponentWithFallback as _createComponentWithFallback } from 'vue';
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
   const n0 = _createComponentWithFallback(_component_Comp, { modelValue: () => (_ctx.foo),
   "onUpdate:modelValue": () => _value => (_ctx.foo = _value),
-  modelModifiers: () => ({ trim: true, "bar-baz": true }) }, null, true)
+  modelValueModifiers: () => ({ trim: true, "bar-baz": true }) }, null, true)
   return n0
 }"
 `;

diff --git a/packages/compiler-vapor/__tests__/transforms/vModel.spec.ts b/packages/compiler-vapor/__tests__/transforms/vModel.spec.ts
@@ -266,13 +266,13 @@ describe('compiler: vModel transform', () => {
       })
     })
 
-    test('v-model for component should generate modelModifiers', () => {
+    test('v-model for component should generate modelValueModifiers', () => {
       const { code, ir } = compileWithVModel(
         '<Comp v-model.trim.bar-baz="foo" />',
       )
       expect(code).toMatchSnapshot()
       expect(code).contain(
-        `modelModifiers: () => ({ trim: true, "bar-baz": true })`,
+        `modelValueModifiers: () => ({ trim: true, "bar-baz": true })`,
       )
       expect(ir.block.dynamic.children[0].operation).toMatchObject({
         type: IRNodeTypes.CREATE_COMPONENT_NODE,

diff --git a/packages/compiler-vapor/src/generators/component.ts b/packages/compiler-vapor/src/generators/component.ts
@@ -240,9 +240,7 @@ function genModelModifiers(
   if (!modelModifiers || !modelModifiers.length) return []
 
   const modifiersKey = key.isStatic
-    ? key.content === 'modelValue'
-      ? [`modelModifiers`]
-      : [`${key.content}Modifiers`]
+    ? [`${key.content}Modifiers`]
     : ['[', ...genExpression(key, context), ' + "Modifiers"]']
 
   const modifiersVal = genDirectiveModifiers(modelModifiers)

diff --git a/packages/runtime-core/__tests__/componentEmits.spec.ts b/packages/runtime-core/__tests__/componentEmits.spec.ts
@@ -325,7 +325,7 @@ describe('component: emit', () => {
     const Comp = () =>
       h(Foo, {
         modelValue: null,
-        modelModifiers: { number: true },
+        modelValueModifiers: { number: true },
         'onUpdate:modelValue': fn1,
 
         foo: null,
@@ -356,7 +356,7 @@ describe('component: emit', () => {
     const Comp = () =>
       h(Foo, {
         modelValue: null,
-        modelModifiers: { trim: true },
+        modelValueModifiers: { trim: true },
         'onUpdate:modelValue': fn1,
 
         foo: null,
@@ -410,7 +410,7 @@ describe('component: emit', () => {
     const Comp = () =>
       h(Foo, {
         modelValue: null,
-        modelModifiers: { trim: true },
+        modelValueModifiers: { trim: true },
         'onUpdate:modelValue': fn1,
 
         firstName: null,
@@ -464,7 +464,7 @@ describe('component: emit', () => {
     const Comp = () =>
       h(Foo, {
         modelValue: null,
-        modelModifiers: { trim: true, number: true },
+        modelValueModifiers: { trim: true, number: true },
         'onUpdate:modelValue': fn1,
 
         foo: null,
@@ -492,7 +492,7 @@ describe('component: emit', () => {
     const Comp = () =>
       h(Foo, {
         modelValue: null,
-        modelModifiers: { trim: true },
+        modelValueModifiers: { trim: true },
         'onUpdate:modelValue': fn,
       })
 

diff --git a/packages/runtime-core/src/helpers/useModel.ts b/packages/runtime-core/src/helpers/useModel.ts
@@ -145,9 +145,9 @@ export const getModelModifiers = (
   modelName: string,
   getter: (props: Record<string, any>, key: string) => any,
 ): Record<string, boolean> | undefined => {
-  return modelName === 'modelValue' || modelName === 'model-value'
-    ? getter(props, 'modelModifiers')
-    : getter(props, `${modelName}Modifiers`) ||
-        getter(props, `${camelize(modelName)}Modifiers`) ||
-        getter(props, `${hyphenate(modelName)}Modifiers`)
+  return (
+    getter(props, `${modelName}Modifiers`) ||
+    getter(props, `${camelize(modelName)}Modifiers`) ||
+    getter(props, `${hyphenate(modelName)}Modifiers`)
+  )
 }
diff --git a/packages/runtime-vapor/__tests__/componentEmits.spec.ts b/packages/runtime-vapor/__tests__/componentEmits.spec.ts
@@ -265,7 +265,7 @@ describe('component: emit', () => {
     const fn2 = vi.fn()
     render({
       modelValue: () => null,
-      modelModifiers: () => ({ number: true }),
+      modelValueModifiers: () => ({ number: true }),
       ['onUpdate:modelValue']: () => fn1,
       foo: () => null,
       fooModifiers: () => ({ number: true }),
@@ -291,7 +291,7 @@ describe('component: emit', () => {
       modelValue() {
         return null
       },
-      modelModifiers() {
+      modelValueModifiers() {
         return { trim: true }
       },
       ['onUpdate:modelValue']() {
@@ -327,7 +327,7 @@ describe('component: emit', () => {
       modelValue() {
         return null
       },
-      modelModifiers() {
+      modelValueModifiers() {
         return { trim: true, number: true }
       },
       ['onUpdate:modelValue']() {
@@ -361,7 +361,7 @@ describe('component: emit', () => {
       modelValue() {
         return null
       },
-      modelModifiers() {
+      modelValueModifiers() {
         return { trim: true }
       },
       ['onUpdate:modelValue']() {