在 React 应用中，如果两个组件没有直接的父子关系，有哪些常用的通信方式？
考察说明
考查对 React 组件间通信机制的掌握，尤其是非父子关系的处理。
回答思路
- 【回答框架 1】非父子组件通信的核心是借助共享状态或事件机制，打破组件树的层级限制。常见方式包括状态提升、Context、事件总线、以及状态管理库。
- 【回答框架 2】状态提升：将共享状态放到最近的共同父组件，通过 props 传递数据和回调函数，适用于层级不深、状态简单的场景。
- 【回答框架 3】Context：使用 React.createContext 创建上下文，Provider 提供值，useContext 在任意后代组件中消费，适用于跨多层级传递数据，避免逐层传递 props。
- 【回答框架 4】事件总线：利用一个全局事件对象，组件通过订阅和发布事件通信（如 mitt），适用于任意组件间的解耦通信，但需注意手动管理订阅和销毁，防止内存泄漏。
- 【回答框架 5】状态管理库：如 Redux、Zustand、MobX 等，集中管理共享状态，组件通过 hooks 或 connect 订阅，适用于大型应用或复杂状态逻辑，提供时间旅行和调试工具。
- 【关键点 1】状态提升适合简单且距离近的场景，Context 适合跨层级广播，但频繁更新可能影响性能。
- 【关键点 2】事件总线实现完全解耦，但需自行处理订阅生命周期。
- 【关键点 3】状态管理库集中管理，适合中大型项目，但增加额外依赖和样板代码。
- 【易错点 1】事件总线若不取消订阅，可能导致内存泄漏和重复触发。
- 【易错点 2】Context 值变更会导致所有消费组件重渲染，需配合 memo 或拆分 Context 优化。
- 【易错点 3】状态管理库引入过度设计，对小应用反而增加复杂度。