关于组件通信我相信小伙伴们肯定也都很熟悉，就不多说了，对组件还不熟悉的可以查看这里。

官方推荐的状态管理方案是 Vuex。不过如果项目不是很大，状态管理也没有很复杂的话，使用 Vuex 有种杀鸡用牛刀的感觉，当然，这也是要根据自己的需求来的，只是建议。

官方也推荐了一种非父子组件的通信，在简单的场景下，可以使用一个空的 Vue 实例作为事件总线也就是下面要说的 Bus 。

我习惯把Bus定义在全局，这样使用起来的时候就不用再去单独引用。

// app.js
var eventBus = {
    install(Vue,options) {
        Vue.prototype.$bus = new Vue()
    }
};
Vue.use(eventBus);

或者可以新建一个event-bus.js文件：

import Vue from 'vue'
export const EventBus = new Vue()

然后在其他页面引入：

import { EventBus } from '@/assets/js/event-bus.js';

就可以在组件中，可以使用$emit， $on， $off 分别来分发、监听、取消监听事件：

分发事件的组件：

methods: {
  todo: function () {
    this.$bus.$emit('todoSth', params);  //params是传递的参数
    //...
  }
}

监听的组件：

// ...
created() {
  this.$bus.$on('todoSth', function(params){  //获取传递的参数并进行操作
      //todo something
  })
},
// 最好在组件销毁前
// 清除事件监听
beforeDestroy () {
  this.$bus.$off('todoSth');
}