eventbus vue实现
安装依赖
在项目中安装 eventbus 相关依赖，通常使用 mitt 或 events 库。以 mitt 为例：
npm install mitt创建 EventBus 实例
在项目中创建一个全局的 EventBus 实例，通常放在单独的模块中（如 event-bus.js）：
import mitt from 'mitt';
export const eventBus = mitt();发送事件
在需要触发事件的组件中，通过 emit 方法发送事件：
import { eventBus } from './event-bus.js';
eventBus.emit('custom-event', { data: 'payload' });监听事件
在需要接收事件的组件中，通过 on 方法监听事件：
import { eventBus } from './event-bus.js';
eventBus.on('custom-event', (payload) => {
console.log('Received:', payload);
});移除监听
为避免内存泄漏，在组件销毁时（如 Vue 的 beforeUnmount 钩子）移除监听：
import { eventBus } from './event-bus.js';
eventBus.off('custom-event', callback); // 移除指定回调
// 或移除所有监听
eventBus.all.clear();使用场景示例
- 跨组件通信：兄弟组件、祖孙组件间传递数据。
- 全局状态通知：如用户登录状态变化、路由切换等。
注意事项
- 命名冲突：事件名建议使用命名空间（如
user:login）。 - 性能影响：高频事件需谨慎使用，避免过度依赖 EventBus。
替代方案
对于复杂状态管理，可考虑 Vuex 或 Pinia。EventBus 更适合简单场景或临时通信。
