vue中eventbus的使用方法?

在 Vue 中，EventBus 可以用来进行组件之间的通信，以下是 EventBus 的使用方法：

1. 创建 EventBus

可以在 Vue 实例中创建一个 EventBus：

// main.js
import Vue from 'vue'

export const EventBus = new Vue();

2. 在组件中使用 EventBus

在需要使用 EventBus 的组件中，可以通过 `import` 引入 EventBus，并在 `created()` 生命周期中使用 `EventBus.$on()` 方法监听事件，使用 `EventBus.$emit()` 方法触发事件：

// ComponentA.vue
<template>
  <div>
    <button @click="sendMessage">发送消息</button>
  </div>
</template>

<script>
  import { EventBus } from '@/main';

  export default {
    name: 'ComponentA',
    methods: {
      sendMessage() {
        EventBus.$emit('message', 'Hello, ComponentB!');
      }
    }
  }
</script>

// ComponentB.vue
<template>
  <div>
    <p>{{ message }}</p>
  </div>
</template>

<script>
  import { EventBus } from '@/main';

  export default {
    name: 'ComponentB',
    data() {
      return {
        message: ''
      }
    },
    created() {
      EventBus.$on('message', (message) => {
        this.message = message;
      });
    }
  }
</script>

在上面的示例中，`ComponentA` 发送了一个名为 `message` 的事件，并传递了一个字符串参数，`ComponentB` 监听了 `message` 事件，并在收到事件后将参数赋值给 `message` 数据。这样就实现了 `ComponentA` 向 `ComponentB` 发送消息的功能。