vue---组件传值--eventBus

eventBus—兄弟组件传值

两个组件页面a、b，属于兄弟关系，要求实现a向b传值，其传值实现过程如下：
首先在vue 项目中的 main.js 创建一个 vue实例，

export const eventBus = new Vue()

其中在a页面使用 eventBus，代码如下：

import { eventBus } from "../main";
 eventBus.$emit("userName", this.username);

在 b 页面使用 eventBus，代码如下：

  eventBus.$on("userName", (message) => {
  console.log(message)
  })

缺点

1.使用 eventBus ，当页面刷新后，同样会出现 传值消失的问题，因此应该考虑结合 本地存储 一起使用。
2.eventBus 也有可能出现第一次监听不到数据的情况，这主要涉及了 vue 的声明周期，
尝试解决办法：
（1）eventBus 的 $on 必须在 $emit 之前执行。
（2）vue的生命周期的问题。A页面向B页面传值，B页面先执行created，A页面执行beforeDestroy,destroyed,所以A页面的bus.on不会自动销毁，记得在B页面的destroyed生命周期中bus.$off销毁监听