fix: use modelValueModifiers intead of modelModifiers

Author: zhiyuanzmj

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"]`)
   })

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,

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 }) {

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 } }',

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  }`

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,
       })
 

packages/runtime-core/src/helpers/useModel.ts

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