请列举 Vue 组件间通信的常见方式，并说明各自适用的场景。

回答思路

1. 【回答框架 1】父组件向子组件通信，主要通过 props 传递数据；子组件向父组件通信，通过触发自定义事件（$emit）实现。这是最基础的父子通信方式。
2. 【回答框架 2】兄弟组件或隔代组件通信，可以使用事件总线（Event Bus）或 Vuex（状态管理）。事件总线适合简单场景，但不易维护；Vuex 适合复杂状态管理。
3. 【回答框架 3】对于跨层级或深层嵌套的组件，可以使用 provide/inject 实现祖先向后代注入数据，但该方式不是响应式的，除非结合 reactive 或 ref。
4. 【回答框架 4】此外，还有 $refs 直接访问子组件实例，适用于父组件主动获取子组件状态或调用方法；以及 $attrs 和 $listeners（Vue 2）或 Vue 3 中的 $attrs 用于透传属性。
5. 【关键点 1】props 和 $emit 是父子通信的基础。
6. 【关键点 2】事件总线适合兄弟或简单跨级通信，但维护成本高。
7. 【关键点 3】Vuex 适合复杂状态共享。
8. 【关键点 4】provide/inject 适合深层嵌套的祖先后代通信，且非响应式。
9. 【关键点 5】$refs 用于父组件直接操作子组件实例。
10. 【易错点 1】事件总线在组件销毁时需移除监听，否则可能内存泄漏。
11. 【易错点 2】provide/inject 默认非响应式，若需响应式需使用 reactive 或 ref 包装。
12. 【易错点 3】滥用 $refs 可能导致组件耦合度高。