vue30：v-model语法糖的本质

在Vue.js框架中，`v-model` 是一个指令，用于在表单输入和应用状态之间创建双向数据绑定。它本质上是语法糖，意味着它提供了一种更简洁的方式来编写代码，而不需要显式地编写额外的代码。

具体来说，`v-model` 背后实际上是由以下几个部分构成：

1. `value` 属性：绑定到输入字段的值。
2. `input` 事件监听器：当输入字段的值发生变化时，触发更新。
3. `change` 事件监听器：对于某些类型的输入元素（如`select`和`textarea`），当值变化时触发更新。

例如，对于一个简单的文本输入框：

这行代码实际上会被Vue编译成：

对于`checkbox`、`radio`按钮和`select`元素，`v-model`的行为略有不同，但原理相似，都是通过监听事件和设置属性来实现双向绑定。

使用`v-model`可以减少模板中的样板代码，使代码更加清晰和易于维护。

二：v-model表单封装

         1：子组件传给父组件，实现数据的双向绑定

        2：子组件传给父组件，父组件通过v-model直接实现数据的双向绑定