Vue.js 事件总线 (EventBus) 使用指南

Vue EventBus 是 Vue.js 中一种用于不同组件之间传递数据和触发事件的事件传递机制。Vue 提供了一个全局的 EventBus，可以用来实现组件间的通信。以下是 EventBus 的使用方法：

1. 创建 EventBus

可以在 Vue 实例中创建 EventBus，也可以在单独的 JS 文件中创建 EventBus。

// 在 Vue 实例中创建 EventBus
var bus = new Vue();

// 在单独的 JS 文件中创建 EventBus
export const bus = new Vue();

2. 发送事件

在发送事件之前，需要先在组件中引入 EventBus。

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

然后可以通过 $emit 方法发送事件。

bus.$emit('eventName', data);

其中，'eventName' 是事件名称，data 是要传递的数据。

3. 接收事件

在接收事件之前，也需要先在组件中引入 EventBus。

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

然后可以通过 $on 方法接收事件。

bus.$on('eventName', function(data) {
  // 处理事件
});

其中，'eventName' 是要接收的事件名称，function 是事件处理函数，data 是传递过来的数据。

4. 取消事件

在组件销毁时，需要取消事件监听，以免引起内存泄漏。

bus.$off('eventName');

其中，'eventName' 是要取消的事件名称。如果没有指定事件名称，则会取消所有事件监听。

以上就是 Vue EventBus 的用法，通过 EventBus 可以很方便地实现组件之间的通信。