发布订阅模式通过事件总线将强耦合降为对总线的弱依赖，但需规范事件名、可控生命周期、避免滥用；props/$emit在深层或跨级组件通信时导致中转污染与父组件职责膨胀，易引发生命周期错位和调用链断裂。
发布订阅模式不能彻底消除耦合，但能将强耦合降级为对事件总线的弱依赖——前提是事件名规范、生命周期可控、不滥用全局事件。
为什么直接 $emit / props 会引发强耦合
父子组件用 props 和 $emit 看似简洁，但一旦组件层级变深（比如 A → B → C → D），D 要通知 A 就得层层透传，B 和 C 被迫成为“中转站”，逻辑污染严重；更麻烦的是，如果 A 和 D 根本不相邻（如兄弟组件、跨路由组件），就得靠父组件做中介，父组件迅速膨胀成“事件调度中心”，职责失焦。
常见错误现象：TypeError: this.$parent.$emit is not a function、Event not received after component unmounted，本质都是耦合导致生命周期错位或调用链断裂。
手写一个轻量 EventBus 的关键约束
不用第三方库也能快速落地，但必须守住三条线：事件命名空间化、监听器自动清理、禁止匿名回调。
- 事件名必须带作用域前缀，例如
"user:login-success"而非"login"，避免冲突 - 所有
on必须绑定到组件实例上（如this.bus = new EventBus()），并在beforeUnmount（Vue 3）或beforeDestroy（Vue 2）里调用offAll，否则内存泄漏 - 不能这样写：
bus.on('data', () => { ... })；必须存引用：this.handler = (v) => {...}; bus.on('data', this.handler)，否则无法精准移除
示例（Vue 3 setup）：
const bus = new EventBus()
onMounted(() => {
bus.on('order:created', handleOrderCreated)
})
onBeforeUnmount(() => {
bus.off('order:created', handleOrderCreated)
})
mitt 比原生 EventBus 多解决了什么
mitt 是最常用的轻量替代方案（仅 200B），它默认支持通配符 * 和异步事件，但更重要的是——它不依赖 this 上下文，天然适配 Composition API。
- 通配符可用于调试：
mitt.on('*', (type, detail) => console.log(type, detail)) - 不支持自动清理，仍需手动
off；但提供all.clear()一键清空（慎用，可能误杀其他模块监听） - 与 Vue Router 导航守卫配合时更稳：在
beforeEach中发事件，mitt不会因组件未挂载而丢事件（原生EventBus若监听器未就绪就发事件，会静默失败）
注意兼容性：mitt 不支持 IE，若需兼容请用 tiny-emitter 或自行 polyfill。
哪些场景不该用发布订阅
不是所有通信都适合事件驱动。以下情况强行上 mitt 或自建 EventBus 反而增加维护成本：
- 父子组件之间单向数据流明确（如表单子组件提交后通知父组件刷新列表）——直接
defineEmits更直观 - 状态需要响应式同步（如主题色、用户权限）——用
provide/inject+ref或 Pinia 更合适 - 事件触发频率极高（如鼠标移动、滚动节流前）——频繁
emit会造成事件队列积压，应改用函数回调或 requestIdleCallback
最容易被忽略的一点：事件参数尽量扁平化。别传整个组件实例或大型响应式对象，只传必要 ID 或状态码，否则监听方被迫依赖发送方的数据结构，又绕回强耦合。
