新增编译宏defineModel

组件之间通讯，通过 props 和 emits 进行通讯,是单向数据流，比如：props是自上而下的（父组件数据修改导致子组件更新，而自己不能修改父组件传入的 props属性），而emits是自下而上的（子组件通过事件触发父组件事件）；

defineModel() 返回的值是一个 ref。
它可以像其他 ref 一样被访问以及修改，不过它能起到在父组件和当前变量之间的双向绑定的作用：
defineModel() 实现原理：defineModel() 的双向绑定是在编译之后，创建了一个model的ref变量以及一个modelValue的props，并且watch了props中的modelValue；当子组件中的modelValue更新时，会触发update:modelValue事件，当父组件接收到这个事件时候，同时更新父组件的变量；
它的 .value 和父组件的 v-model 的值同步；
当它被子组件变更了，会触发父组件绑定的值一起更新。

// 声明 "modelValue" prop，由父组件通过 v-model 使用
const model = defineModel()
// 或者：声明带选项的 "modelValue" prop
const model = defineModel({ type: String })

// 在被修改时，触发 "update:modelValue" 事件
model.value = "hello"

// 声明 "count" prop，由父组件通过 v-model:count 使用
const count = defineModel("count")
// 或者：声明带选项的 "count" prop
const count = defineModel("count", { type: Number, default: 0 })

function inc() {
// 在被修改时，触发 "update:count" 事件
count.value++
}

 

 

<Child v-model="myRef"></Child>