mitt是vue 3中替代eventbus的轻量级事件总线，专用于兄弟、隔代等无直接关系组件的解耦通信；当prop drilling明显或父子emit不足时适用，需在组件卸载时调用off防止内存泄漏。
Vue 3 中，mitt 是替代 Vue2 EventBus 的轻量级事件总线方案，专为跨组件通信设计，尤其适合兄弟、隔代或无直接关系的组件间解耦通信。
什么时候该用 mitt？
当 props 层层透传（prop drilling）开始明显、父子 emit 不再够用时，就是 mitt 的典型使用时机：
- 兄弟组件需要响应彼此状态（如表单提交后刷新列表）
- 深层嵌套中，祖组件想通知某个孙组件执行动作（比如全局搜索触发侧边栏高亮）
- 多个不相关组件需监听同一类事件（如用户登出后，菜单、头像、缓存模块同步清理）
- 避免把大量中转逻辑堆在父组件里，让父组件只负责结构，不承担通信调度
如何正确配置 mitt 实例？
推荐在 src/utils/eventBus.ts 中统一创建并导出类型安全的实例：
✅ 基础写法（适合快速验证）：
import mitt from 'mitt';<br>export const emitter = mitt();
✅ 类型增强写法（推荐用于中大型项目）：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章