Vue3-在HTML标签、组件标签上使用v-model

本篇为Vue3学习中遇到的v-model相关的记录，如有问题欢迎指正

一、在标签上使用v-model

v-model通常在input、select等标签上来实现数据双向绑定

原理：v-model通过给标签value赋值来实现  数据—>页面 的绑定。然后通过绑定input事件实现 页面—>数据 的绑定。

二、在组件标签上使用v-model

1、使用v-model默认传值

// 上面的v-model可以拆解为

原理：在组件上时，v-model通过 :modelValue 来进行页面传值，然后通过子组件触发 update:modelValue 事件来对所绑定值进行修改

2、使用v-model时指定参数名

优点：可以自由指定参数名、事件名(update:xx)。并且可以同时绑定多个v-model值