1.组件之间的关系
在项目开发中,组件之间的最常见的关系分为如下两种:父子关系,兄弟关系
2.父子组件之间的数据共享
父子组件之间的数据共享又分为:
- 父->子共享数据
- 子->父共享数据
2.1 父组件向子组件共享数据
父组件向子组件共享数据需要使用自定义属性。示例代码如下:
2.2子组件向父组件共享数据
子组件向父组件共享数据使用自定义事件。示例代码如下:
3.兄弟组件之间的数据共享
在vue2.x中,兄弟组件之间数据共享的方案是EventBus。
EventBus的使用步骤
- 创建eventBus.js模块,并向外共享一个vue的实例对象
- 在数据发送方,调用
bus.$emit
(‘事件名称’,要发送的数据)方法触发自定义事件 - 在数据接收方,调用
bus.$on
("事件名称’,事件处理函数)方法注册一个自定义事件