在 React 中，Consumer 组件扮演什么角色？请阐述其主要用途和典型应用场景。
考察说明
考查对 React Context API 中 Consumer 组件的理解及其在跨层级状态共享中的作用。
回答思路
- 【回答框架 1】Consumer 是 React Context 提供的一种订阅方式，用于在函数组件或类组件中读取 Context 的值。它接收一个函数作为子节点，该函数会接收当前的 context 值并返回 React 元素。
- 【回答框架 2】它的主要作用是在不使用 useContext Hook 的情况下，在类组件或函数组件中访问 Context 数据，实现跨组件层级的数据传递，避免逐层传递 props。
- 【回答框架 3】典型应用场景包括主题切换、用户登录信息、语言偏好等全局状态管理。通常与 Provider 配合使用，Provider 提供值，Consumer 消费值。
- 【回答框架 4】与 useContext 相比，Consumer 更适用于类组件或需要回调函数形式的场景。在函数组件中，useContext 更简洁。
- 【关键点 1】Consumer 必须嵌套在对应的 Provider 内部才能获取到值，否则使用默认值。
- 【关键点 2】Consumer 的 children 必须是一个函数，该函数接收 context 值作为参数。
- 【关键点 3】Context 值变化时，Consumer 会重新渲染，触发函数执行。
- 【易错点 1】不要将 Consumer 作为独立的标签使用，必须结合 Provider 的 value 属性。
- 【易错点 2】避免过度使用 Context 导致组件重渲染问题，可考虑拆分 Context。
- 【易错点 3】在类组件中使用 Consumer 时，注意与 static contextType 的区别，后者只能订阅单个 Context。