我们知道，v-model是v-bind+v-on的语法糖，
在Vue2，v-model="数据" <=>:value="数据"+@input="数据=$event"
在Vue3，v-model:属性="数据" <=> :属性="数据" + @update:属性="数据=$event"
注释：以上为直观变化，以下为变化缘由和详细解释
思想：只需要把唯一变为活性，再加一个默认值作为保障(只能绑定固有属性改为提供一个默认值，此外由开发者自定义属性名)
Vue2中组件value不能有多个是导致v-model只能绑定一个数据的原因
对的，在Vue3中，v-model的使用发生了一点变化，为了能够直接通过v-model实现多数据绑定，Vue3将Vue2中数据只有唯一属性value可绑定的规定，活性变为自定义数据绑定的属性，而规定数据默认绑定的属性为modelValue，开发者可以为数据绑定的属性自定义其它任意名字。它将唯一绑定变为可扩展，取消了:属性.sync的冗余的(Vue2)旧版多数据绑定功能。
数据的更新事件从Vue2中绑定【input事件】替换为了绑定【update:属性事件】
通过v-model:属性的语法，能够每次使用一个v-model就实现一个数据的双向绑定。
思想-一句话总结：只能绑定固有属性value改为提供一个默认值modelValue，此外由开发者自定义与数据绑定的属性名。
注解：
上述总结中，数据指的是响应式数据。
属性指的是自定义属性，是子组件中接到的传参的名字，为保证一般性，为数据绑定到子组件中的属性设置了默认属性名modelValue，则@update:modelValue则作为数据的默认更新事件，
于是，默认情况下使用v-model，等价于:modelValue+@update:modelValue。
@update:属性="数据 = $event"：
- $event：子组件通过update:属性事件抛出的值；
- 数据：父组件中的响应式变量。
- @input="数据 = $event"解释同理。
直观理清关系
1.v-model:属性="数据"：2+3的语法糖，实现页面可主动修改数据，数据可主动驱动页面；
2.:属性="数据"：将数据绑定到属性上；
3.@update:属性="数据=$event"：处理属性对应数据的更新；
2+3实现双向绑定，而1等价于2+3。
v-model:属性 是通用语法，若不写:属性，则默认是名为modelValue的属性绑定这个数据，数据默认更新事件为@update:modelValue。
严谨注意：双向数据绑定是属性绑定响应式数据，但是更新事件是对于数据的。
v-model带来的便利
Vue3，需要实现双向绑定，不用v-model语法糖需要：
<ChildComponent
:modelValue="响应式数据A"
:自定义属性名="响应式数据B"
@update:modelValue="函数(参数)"
@update:自定义属性名="函数(参数)"
/>
使用v-model语法糖则只需要:
<ChildComponent
v-model="响应式数据A"
v-model:自定义属性名="响应式数据B"
/>
最后，如果面试问Vue3双向数据绑定v-model的变化？
你回答：其实很简单嘛————————
通常说法就是Vue3的v-model支持多数据双向绑定，然后默认属性和事件变为modelValue和@update:modelValue，但其实这不是准确的说法，只是含糊的概括。
准确来说是，v-model的使用语法变为默认和通用两种方式：
1.默认直接使用v-model双向绑定一个响应式数据，使用组件的modelValue属性来绑定这个数据，使用update:modelValue事件作为这个数据的更新事件，
2.通用就是通过v-model:属性名="数据"的语法，自定义与响应式数据绑定的属性。通过这个语法v-model可以绑定多个响应式数据；
另外要说这个更新事件的内容就是 数据=$event，即响应式数据=组件返回值。
其中为便于理解，我用词称"两种方式"，但实际上语法就是v-model:属性="数据"，不写:属性则为默认。
3.允许自定义修饰符，
-
父组件通过<Child v-model:属性.修饰符="数据" />来调用，
-
子组件中在props{}中定义 属性Modifiers:{ default:()=>({}) }接住，
-
注意，属性Modifiers是规定命名方式，且是小驼峰。
-
在属性对应的处理函数中，判断是否存在这个修饰符，有则执行修饰符对应功能来处理事件拿到的新数据，无则正常处理。
-
通过修饰符，可以给子组件属性数据添加去空格trim、toUpperCase等功能，父组件中能够通过
v-model:属性.修饰符轻松使用这些功能。
注意：实际上Vue3为v-model保留了2个内置修饰符，
number:将输入值转换为数字类型
trim：自动去除值收尾的空白字符
这两个修饰符是Vue框架原生支持的，无需额外配置即可在原生表单元素上直接使用。
🥔思想层面：让唯一的value变为动态自定义，从而实现多数据双向绑定。
为什么要知道v-model是谁的语法糖？
在父子通信中，父组件使用子组件，传入一个v-model="数据"，那么我们就知道，组件中要接一个modelValue参数了。
另外，大家想不想知道为什么数据绑定要使用响应式数据呢？
我想，问这个问题要不就是没进一步思考，要不就是爱思考，并想找到有新奇理解或相同想法的友友，想知道的话评论区留言，我会在后续揭晓我的理解，大家一起探讨噢~~~
另外，数据绑定和数据响应式对于初学者来说很容易弄混淆，我把它理清楚了，如果有觉得还想看，评论区中讨论吧。
如果觉得我本文讲得还不错，可以给个小小的赞嘛~~~ 3Q！我是LC_Happy，祝我们都会拥有一个向往的快乐生活！
