在 Vue 中，provide 和 inject 这对选项分别承担什么职责？它们通常用于解决组件间通信的哪类场景？

回答思路

1. 【回答框架 1】provide 和 inject 是 Vue 提供的跨层级组件通信方案，允许父组件通过 provide 提供数据或方法，任意后代组件通过 inject 声明式地接收，从而避免逐层传递 props。
2. 【回答框架 2】provide 选项可以是一个对象或返回对象的函数，inject 选项可以是一个字符串数组或对象，用于声明需要注入的属性；注入的属性在组件实例上可直接访问。
3. 【回答框架 3】该机制主要用于深层嵌套组件或高阶组件库中，传递全局配置、主题、服务等，减少中间层的显式传递，但会降低组件间的显式依赖关系，需谨慎使用。
4. 【回答框架 4】与 props 相比，provide/inject 是非响应式的（除非提供的是响应式对象），且不保证子组件更新；与 Vuex 或 Pinia 相比，它更轻量，适合局部共享状态。
5. 【回答框架 5】使用时需注意注入的属性在父组件更新时可能不会自动同步，若需要响应式，应提供 ref 或 reactive 对象。
6. 【关键点 1】provide 提供数据，inject 接收数据，实现跨层级通信。
7. 【关键点 2】适用于深层嵌套组件或库开发，减少 props 逐层传递。
8. 【关键点 3】默认非响应式，需提供响应式对象才能实现响应式更新。
9. 【关键点 4】与 props 相比，依赖关系更隐式，需权衡可维护性。
10. 【易错点 1】误以为 provide/inject 是响应式的，导致数据更新不触发视图刷新。
11. 【易错点 2】在非父子组件间使用，导致依赖关系混乱，难以追踪。
12. 【易错点 3】过度使用，使组件耦合度增加，降低可复用性。