在平时写代码中，用的父子组件通信比较多，第一次使用非父子组件通信，浏览了一些他人的文章，大体一致的使用，一下是我的案例中使用
使用场景：在不是父子组件关系进行通信传值，在elementui中tabs页之间通信，即在负载均衡页面把异步操作获取的值传递到另一个tab页域名配置：负载均衡页面 => 域名配置页面
在我的案例中，只有在同一个路由中的组件才能进行非父子通信，两个不同的路由的组件相互通信用这个方法好像不行，不起作用，我对这个还不是了解很深入，目前还母鸡怎么肥事，望指点，十分感谢！
1、创建一个eventBus空的vue实例作为一个事件总线，作为中转，为什么用新的vue实例，易于管理（别人说的）。
在utils文件夹新建一个空的vue实例bus.js，内容如下：
/** bus.js
* 使用eventBus
*/
import Vue from 'vue'
const bus = new Vue()
export default bus
2、使用 使用 
on 接受传值，$off销毁时间绑定
/** 在负载均衡页面
*/
<script>
import { getLbList } from '@/api/app-lb.js' // 接口的封装 获取负载均衡的列表接口
import bus from '@/utils/bus.js'
export default {
data() {
return {
lbList: []
}
},
methods: {
// 获取负载均衡列表
getLbList() {
this.loadings.lb = true
getLbList(this.appId).then(res => {
this.lbList = res.model ? res.model.map(item => new DeploymentModel(item)) : []
bus.$emit('BusGetLBList', this.lbList) // 与域名配置通信
this.loadings.lb = false
}).catch((err) => {
this.loadings.lb = false
this.lbList = []
err.errorMessage ? this.$message.info(err.errorMessage) : this.$message.info('获取负载均衡列出错，请稍后重试')
})
},
}
}
</script>
/** 在域名配置页面
*/
<script>
import bus from '@/utils/bus.js' // 与负载均衡非父子之间通信
export default {
name: 'TemplateDialog',
data() {
return {
LbList: [], // 与负载均衡通信获取负载均衡列表
}
},
// 必须放在created中
created() {
bus.$on('BusGetLBList', val => {
val.length ? (
this.LbList = val
) : (
this.LbList = []
)
})
},
// 组件销毁时解除事件绑定
beforeDestroy() {
bus.$off('BusGetLBList')
},
