综合实训
侯素玲

1
2
3
4
5

v-model

发布时间:2023-10-14 20:18   发布人:侯素玲   浏览次数:143

任务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 - 实现父向子同步数据
视频3v-model - 实现子向父同步数据