最近碰到了比较多的关于vue的eventBus的问题，之前定技术选型的时候也被问到了，vuex和eventBus的使用范围。所以简单的写一下。同时有一种特殊的实现方案。
有这么几种数据传递方式，vuex、props、eventBus和特殊的eventBus。
特殊的eventBus
// bus const bus = new Vue({ data () { return { // 定义数据 val1: ‘‘ } }, created () { // 绑定监听 this.$on(‘updateData1‘, (val)=>{ this.val1 = val }) } }) //数组发出组件 import bus from ‘xx/bus‘ // 触发在bus中已经绑定好的事件 bus.$emit(‘update1‘, ‘123‘) //数据接收组件 {{val1}} // 使用computed接收数据 computed () { val1 () { // 依赖并返回bus中的val1 return bus.val1 } }
与正统的eventBus不同
-
正统的eventBus只是用来绑定和触发事件，并不关心数据，不与数据发生交集。而这个方案多一步将数据直接添加在bus实例上。且事件监听与数据添加需提前定义好。
-
数据接收方不再使用$on来得知数据变化，而是通过计算属性的特征被动接收。
解决的问题
-
通信组件需同时存在？数据在bus上存储，所以没有要求。
-
多次绑定？绑定监听都在bus上，不会重复绑定。
-
数据只在$emit后可用？使用计算属性直接读取存在bus上的值，不需要再次触发事件。
