vue3中如何实现自定义组件的双向绑定

可以使用v-model来实现,当然也可以不适用v-model。v-model其实是一种简写形式。
<Component v-model="faData" />
与下面一样
<Component :modelValue="faData" @update:modelValue="faData = $event" />
v-model是下面写法的一种简写。下面的更好理解,就是在组件中使用emit将新值发送到父组件并更新faData的值。
有时候可能会需要再model后面加上名称就像下面这样:

<Component v-model:msg="faData" />
<Component :msg="faData" @update:msg="faData = $event" />
在子组件中还是发出update:msg事件并将新值带过来更新父组件中的faData。其中msg是自己自定义的,一般是update:参数名的形式。其实你如果不使用v-model来实现双向绑定,事件的名称也可以不带update可以自定义。

vue3中如何实现自定义组件的双向绑定

上一篇:RocketMq总结(六) -- 顺序消息


下一篇:leetcode 正则表达式匹配