浅谈Vue的组件通信之子父通信和兄弟通信

一、子父通信

父子通信很简单，就是通过在子组件上定义一个属性，然后子组件props就可以拿到父组件的值

子父通信呢，我们在这里讲了两种方法

第一种是通过五步走的一个方法

1. 父组件声明一条数据

2. 父组件需要写一个更改自身数据的方法

3. 将更改自身数据的方法通过属性方式传递给子组件

4. 子组件需要通过props来接受父组件传递来的方法

5. 子组件就可以通过调用接收过来的方法来把数据传递给父组件了

第二种是通过自定义事件的方式来进行子父传递（前两步与第一种方法是相同的）

只需在从第三步开始，给子组件绑定一个自定义事件 @自定义事件名=父组件处理函数

然后需要在子组件中触发绑定在自身上面的父组件处理函数事件，可以通过

通过this.$emit方法就可以触发@后面的自定义事件，第二个参数就是可以传递参数过去

这样也可以完成子父通信

二、兄弟通信

我们的兄弟之间的通信可以通过关系链来进行操作，也是可以通过今天学习到的ref链来实现的

比如可以给弟弟组件添加一个ref属性,然后通过哥哥组件的$parent找到父亲，然后通过$refs找到弟弟组件，就可以解决兄弟之间通信的问题

解决兄弟通信的第二种方式也可以通过event bus事件总线的方式来进行

核心就是定义一个公共的Vue实例对象，在弟弟组件中在公共的这个实例对象上定义一个事件等待触发，在哥哥组件中通过公共实例触发绑定的自定义事件也可以实现兄弟通信