vue 组件通信

vue最大的特点之一就是组件化，那么组件跟组件之间是如何通信的呢？
常见的有三种通信：

父传子
子传父
兄弟传值

一、父传子

1.创建子组件，在src/components/文件夹下新建一个Child.vue
2.Child.vue的中创建props，然后创建一个名为message的属性

3.在App.vue中注册Child组件，并在template中加入child标签，标签中添加message属性并赋值

或者利用v-bind进行绑定

总结一下：
1.子组件在props中创建一个属性，用以接收父组件传过来的值
2.父组件中注册子组件
3.在子组件标签中添加子组件props中创建的属性
4.把需要传给子组件的值赋给该属性

二、子传父

1.在子组件中创建一个按钮，给按钮绑定一个点击事件

2.在响应该点击事件的函数中使用KaTeX parse error: Expected 'EOF', got '#' at position 202: …mage/format,png#̲pic_center) …emit的第二个参数，该值将作为实参传给响应自定义事件的方法
3.在父组件中注册子组件并在子组件标签上绑定对自定义事件的监听

三、兄弟传值

事件总线fan

1.我们先来创建*事件总线，在src/assets/下创建一个eventBus.js,内容如下

2. 创建一个firstChild组件，引入eventBus这个事件总线，接着添加一个按钮并绑定一个点击事件

3. 我们再创建一个secondChild组件，引入eventBus事件总线，并用一个p标签来显示传递过来的值

4. 在父组件中，注册这两个组件，并添加这两个组件的标签

总结一下：
1.创建一个事件总线，例如demo中的eventBus，用它作为通信桥梁

2.在需要传值的组件中用bus.$emit触发一个自定义事件，并传递参数

3.在需要接收数据的组件中用bus.$on监听自定义事件，并在回调函数中处理传递过来的参数