VUE-毫无关系的组件之间通信

背景：
比如想要实现这样一个效果，当点击侧边菜单的时候，在顶部导航栏展示侧边菜单被选中的菜单名。侧边菜单和顶部导航分别是两个组件。两个毫无关系的组件。

实现：
eventBus- 发布订阅模式

• 写一个eventBus.js文件

import Vue from 'vue';
export default new Vue();

• 在需要通信的组件中分别引入这个文件

// nav
import eventBus from '@utils/eventBus';

// menu
import eventBus from '@utils/eventBus';

• 在侧边菜单中进行发布事件

const curPage = this.$route.meta.title;
eventBus.$emit('changeMenus', curPage);

• 在导航栏中进行订阅事件
  在created或者mounted中进行监听

eventBus.$on('changeMenus', target => {
    this.curPage = target;
  })

这样两个毫无关联的组件之间就可以进行通信了，若有不对及建议，请指出～