Vue事件总线

一、初始化
首先需要创建事件总线并将其导出，以便其它模块可以使用或者监听它。我们可以通过两种方式来处理。先来看第一种，新创建一个 .js 文件，比如 event-bus.js`

// event-bus.js
import Vue from 'vue'
export const EventBus = new Vue()

二 .假设你有两个Vue页面需要通信： A 和 B ，A页面 在按钮上面绑定了点击事件，发送一则消息，想=通知 B页面。

<!-- A.vue -->
<template>
    <button @click="sendMsg()">-</button>
</template>

<script> 
import { EventBus } from "../event-bus.js";
export default {
  methods: {
    sendMsg() {
      EventBus.$emit("aMsg", '来自A页面的消息');
    }
  }
}; 
</script>

三、接收事件

 <!-- IncrementCount.vue -->
    <template>
      <p>{{msg}}</p>
    </template>
    
    <script> 
    import { 
      EventBus 
    } from "../event-bus.js";
    export default {
      data(){
        return {
          msg: ''
        }
      },
      mounted() {
        EventBus.$on("aMsg", (msg) => {
          // A发送来的消息
          this.msg = msg;
        });
      }
    };
    </script>



```javascript
//如果想移除事件的监听，可以像下面这样操作
import { 
  eventBus 
} from './event-bus.js'
EventBus.$off('aMsg', {})