请聊聊 useContext 的实现原理
结论:
useContext在 render 阶段读取当前 Provider 值,并把“我依赖了这个 context”登记到当前 Fiber;当 Provider 值变化时,React 会向下传播变更并调度这些订阅者重新渲染。
1. 读取发生在 render
useContext(Context)会读取 Context 上的“当前值”- 同时把依赖记录到 Fiber 的 dependencies(概念上)
2. Provider 更新如何通知消费者
- Provider value 变化 → 标记相关子树存在 context 变更
- 遍历并找到订阅该 context 的 Fiber,给它们安排更新(分配 lane)
3. 面试补充点
- 只有读取该 context 的组件才会被更新,不读取不会被牵连
- 结合
memo/拆分 Provider 可以降低重渲染范围