任务5 组件上的 v-model
v-model 是双向数据绑定指令,当需要维护组件内外数据的同步时,可以在组件上使用v-model 指令。
在组件上使用 v-model 的步骤:
(1)父组件通过 v-bind: 属性绑定的形式,把数据传递给子组件
(2)子组件中,通过 props 接收父组件传递过来的数据
(3)在父组件v-bind: 指令之前添加 v-model 指令
(4)在子组件中声明 emits 自定义事件,格式为 update:xxx
(5)在子组件中调用 $emit() 触发自定义事件,更新父组件中的数据
视频1 | 为什么要在组件上使用v-model指令 |
视频2 | v-model - 实现父向子同步数据 |
视频3 | v-model - 实现子向父同步数据 |