vue父子组件的通信可以通过props和emit来实现，而兄弟组件无法通过props和emit通信。
但是可以采用eventBus的方式来实现通信,主要的原理是新建一个bus，然后再两个兄弟组件之间引入这个bus，一个组件监听事件，而另一个组件则负责触发事件。
父组件App.vue
<template>
<div id="app">
<img src="./assets/logo.png">
<!--<router-view/>-->
<car>我是汽车，我要加油</car>
<gas-station>加油站</gas-station>
</div>
</template>
<script>
import Car from "./car.vue"
import GasStation from "./car.vue"
export default {
name: 'App',
components:{Car,GasStation}
}
</script>
bus.js
import Vue from "vue"
export default new Vue();
car.vue
<template>
<div @click="handle">汽车</div>
</template>
<script>
import bus from "./bus"
export default{
methods:{
handle(){
//通过emit触发事件，并传值
bus.$emit("eventTarget","我要加油");
}
}
}
</script>
gasStation.vue
<template>
<div>加油站</div>
</template>
<script>
import bus from "./bus"
export default{
mounted(){
//通过on监听事件，回调方法获取数据
bus.$on("eventTarget",v=>{
console.log(v);
});
}
}
</script>
当在car组件上触发点击事件时，就会触发bus上监听的事件，而bus事件监听在gasStation里面，这个时候就会触发gasStation
上的事件监听，而通过回调函数，就可以拿到car组件传过来的数据，从而实现兄弟组件通信。
注释：
//创建一个用于通信的bus模块
let bus = {
install($){
//在vue的原型上添加getBus和setBus
$.prototype.getBus = this.get
$.prototype.setBus = this.set
},
get(key){
//如果实例上有bus对象,返回查询结果，否则undefined
if(this.bus){
return this.bus[key]
}else{
return undefined
}
},
set(key,value){
//如果实例上没有bus对象,创建一个，并设置属性
if(!this.bus){
this.bus = {}
}
this.bus[key] = value
}
}
Vue.use(bus);
//注：写在vue中的main文件中即可.
//当我们在使用的时候。
created(){
this.setBus('name','xiaoming');
console.log(this.getBus('name'));
}
