一、组件之间的关系
父子关系、兄弟关系、跨级关系
二、父子之间数据传递
1、父组件向子组件传递【使用 props】
- 第一步：在父组件中使用子组件时，给子组件绑定属性
- 第二步：在子组件中使用props接收绑定的属性值
2、子组件向父组件传递【使用 $emit】
- 第一步：在子组件中通过$emit触发指定的事件，同时传值
- 第二步：在父组件中给子组件v-on监听事件，同时接收子组件传来的值
3、通过 ref 属性给子组件设置一个名字.
- 父组件通过组件名来获得子组件
- 子组件通过parent 获得父组件
- $refs绑定触发子组件的方法或者获得数据
父组件
子组件
4、使用 provide / inject
- 在父组件中通过 provide提供变量
- 在子组件中通过 inject 来将变量注入到组件 中
- 只要调用了 inject 那么就可以注入 provide中的数据
扫描二维码关注公众号，回复：
17254464 查看本文章
三、兄弟之间传递数据
1、eventBus事件总线(on)
- 本质：是通过创建一个空的 Vue 实例来作为消息传递的对象
- 通信的组件引入这个实例，通信的组件通过在这个实例上监听和触发事件，来实现消息的传递
- 事件总线就相当于一个桥梁，不用组件通过它来通信 使用步骤如下：
- 创建事件中心管理组件之间的通信
- 发送事件
- 接收事件
2、通过 refs 来获取到兄弟组件，也可以进行通信
四、跨级之间传递数据
1、使用 eventBus ，其实就是创建一个事件中心，相当于中转站，可以用它来传递事件和接收事件
【全局事件总线：可以实现任意组件间的数据传递】
