拿到一个「页面输入时整棵树都在重渲染」的 React 应用,如何定位是不是 Context 使用不当导致的?
围绕“拿到一个「页面输入时整棵树都在重渲染」的 React 应用,如何定位是不是 Context 使用不当导致的”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须给出用 Profiler 观察「为什么渲染」归因到 context 值变化的诊断路径,以及确认后的修复方向概览,不展开每种修复的实现。
核心关键词React Profiler 诊断 Context 多余渲染
面试知识索引 · 分类、标签与搜索
React面试题，281 道完整答案
React面试题第 2 页，显示第 51–100 题，共找到 281 道完整解析，可继续按分类、标签与关键词缩小范围。
281筛选结果
52技术分类
178检索标签
6索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
第 2 页
本页面试问题
按稳定语义路径排序
- 0051
- 0052
React 官方为什么把「在 useEffect 里获取服务器数据并存入 state」列为需要框架或路由层介入的场景?
围绕“React 官方为什么把「在 useEffect 里获取服务器数据并存入 state」列为需要框架或路由层介入的场景”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出缺少缓存去重、瀑布、竞态与生命周期耦合这些固有缺陷,不展开竞态修复代码。
核心关键词React useEffect 获取数据 缺陷 官方建议 - 0053
React 中切换筛选条件快速触发多次 effect 请求时,旧响应后到导致界面显示过期数据,官方推荐的解法是什么?
围绕“React 中切换筛选条件快速触发多次 effect 请求时,旧响应后到导致界面显示过期数据,官方推荐的解法是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 cleanup 中置 ignore 标志使过期响应被丢弃的机制,以及为何不能依赖请求顺序假设,不展开缓存方案。
核心关键词React effect 请求竞态 cleanup ignore - 0054
React 中一个多字段共享编辑状态的表单,选择每个字段一个 useState 还是整体一个对象 state 的判断依据是什么?
围绕“React 中一个多字段共享编辑状态的表单,选择每个字段一个 useState 还是整体一个对象 state 的判断”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须给出字段间是否有联动更新、是否整体提交替换这两条判断依据及嵌套过深的代价,不展开受控/非受控概念。
核心关键词React 表单 state 拆分 合并 对象 - 0055
React 中判断一份客户端状态是否值得提升为全局共享状态的标准是什么?
围绕“React 中判断一份客户端状态是否值得提升为全局共享状态的标准是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须给出跨路由存活、多个互不相关子树共用、非 React 代码也要读写等判据,不讨论具体全局库。
核心关键词React 全局状态 局部状态 判断标准 - 0056
为什么通过 Context 共享给多个组件的对象状态必须做不可变更新,直接修改字段会发生什么?
围绕“为什么通过 Context 共享给多个组件的对象状态必须做不可变更新,直接修改字段会发生什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出直接修改不改引用导致消费者收不到变化通知、且违反渲染期纯函数约束,不展开数组更新的具体 API。
核心关键词React Context 共享对象 不可变更新 - 0057
同一个 React Context 嵌套 Provider 时，消费者读取哪一层？
说明嵌套 Context Provider 的最近祖先规则、整个 value 覆盖而非对象合并、undefined 与默认值的区别，以及局部主题扩展和服务端渲染的边界。
核心关键词React Context 嵌套 Provider 覆盖规则 - 0058
React 中父子组件各自在 effect 里请求数据会形成请求瀑布,官方建议的消除思路是什么?
围绕“React 中父子组件各自在 effect 里请求数据会形成请求瀑布,官方建议的消除思路是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出把请求上移到路由或服务端层并行发起、而非在渲染树中逐级触发,不展开竞态处理。
核心关键词React 请求瀑布 并行 获取数据 - 0059
为什么说把接口返回的数据直接塞进 React Context 并不等于拥有了服务器数据缓存?
围绕“为什么说把接口返回的数据直接塞进 React Context 并不等于拥有了服务器数据缓存”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 Context 只是传值通道、没有失效、去重、重取与 staleness 管理,所以缓存职责应交给专门层,不展开具体库对比。
核心关键词React Context 服务器数据 缓存 失效 - 0060
React 19 的 useOptimistic 在共享服务器数据的界面上如何实现乐观更新,提交失败时界面如何回退?
围绕“React 19 的 useOptimistic 在共享服务器数据的界面上如何实现乐观更新,提交失败时界面如何回退”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出乐观值仅在异步操作期间临时呈现、完成后回到真实状态这一生命周期,不展开 useActionState 的表单集成。
核心关键词React 19 useOptimistic 乐观更新 回退 - 0061
React 中一个组件被条件渲染卸载后还想保留它的编辑进度等状态,有哪些手段及取舍?
围绕“React 中一个组件被条件渲染卸载后还想保留它的编辑进度等状态,有哪些手段及取舍”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须对比状态上移、用 CSS 隐藏代替卸载、存入外部存储三条路线的代价,不讨论 key 重置。
核心关键词React 组件卸载 保留状态 方案 - 0062
React 中把父组件传入的 props 用 useState 复制一份再共享给子组件,为什么被认为是反模式?
围绕“React 中把父组件传入的 props 用 useState 复制一份再共享给子组件,为什么被认为是反模式”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 props 更新后本地副本过期、渲染期派生或 key 重置两种替代方案,不展开 effect 同步的写法。
核心关键词React props 复制到 state 反模式 - 0063
React 中把多个组件共享的状态更新逻辑抽成 reducer,相比分散的 useState 在归属和可测试性上带来什么改变?
围绕“React 中把多个组件共享的状态更新逻辑抽成 reducer,相比分散的 useState 在归属和可测试性上带来”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出更新逻辑集中到纯函数、事件派发与状态计算分离便于测试,不展开与 Context 组合的重渲染优化。
核心关键词React useReducer 状态逻辑抽离 共享 - 0064
React useReducer 配合 Context 时，为什么常拆开 state 和 dispatch？
从数据读取与动作提交的不同需求出发，解释 useReducer 和 Context 的职责、dispatch 稳定身份、状态与动作分离的收益，以及拆分后仍可能由父层触发渲染的边界。
核心关键词React useReducer Context state dispatch 拆分 - 0065
React 中需要在多个组件间共享但变化时不应触发渲染的值,为什么应该用 ref 或模块级变量而不是 state?
围绕“React 中需要在多个组件间共享但变化时不应触发渲染的值,为什么应该用 ref 或模块级变量而不是 state”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 ref 变化不触发重渲染的语义与适用值类型(定时器 id、已挂载标记),不讨论 DOM ref 用法。
核心关键词React useRef 共享值 不触发渲染 - 0066
React Context 不支持选择器,组件只想订阅其中一部分数据时有哪些官方认可的规避方案及各自代价?
围绕“React Context 不支持选择器,组件只想订阅其中一部分数据时有哪些官方认可的规避方案及各自代价”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须对比拆分 context、memo 子组件、useSyncExternalStore 三条路线的适用前提,不展开 tearing 的。
核心关键词React Context 选择器 替代方案 - 0067
React 服务端渲染与客户端水合共用 useSyncExternalStore 时,getServerSnapshot 解决什么一致性问题?
围绕“React 服务端渲染与客户端水合共用 useSyncExternalStore 时,getServerSnapsh”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出服务端没有真实订阅源、需保证水合前后快照一致否则 hydration 不匹配,不展开 tearing 问题。
核心关键词useSyncExternalStore getServerSnapshot 水合 - 0068
React 面试中如何区分「服务器状态」与「客户端状态」,这一分类为什么影响状态管理选型?
围绕“React 面试中如何区分「服务器状态」与「客户端状态」,这一分类为什么影响状态管理选型”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出服务器状态有远端权威源、需要缓存失效与重取、不属于组件私有这一分类依据,不展开某个缓存库 API。
核心关键词React 服务器状态 客户端状态 区别 选型 - 0069
为什么 React 的 useSyncExternalStore 要求 getSnapshot 多次调用必须返回缓存的同一个引用?
围绕“为什么 React 的 useSyncExternalStore 要求 getSnapshot 多次调用必须返回缓存”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出返回新对象会被判定为数据已变而触发无限重渲染循环,不展开 subscribe 的触发时机。
核心关键词useSyncExternalStore getSnapshot 缓存 无限循环 - 0070
一个大的 React Context 应该什么时候拆成多个？
结合编辑器设置、光标状态与命令入口，说明 Context 拆分应看消费者重叠、更新频率和业务生命周期，避免只按字段数、Provider 层数或强制 useMemo 作决定。
核心关键词React Context 拆分优化 - 0071
React 官方对共享状态的结构设计提出哪些原则,冗余和矛盾的状态会带来什么具体问题?
围绕“React 官方对共享状态的结构设计提出哪些原则,冗余和矛盾的状态会带来什么具体问题”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖完整回答要覆盖分组关联数据、消除冗余、避免矛盾、避免深层嵌套四原则及各自引发的同步 bug,不展开某个具体表单例子。
核心关键词React 状态结构设计 冗余 矛盾 state - 0072
React 为什么说状态是绑定在 UI 树的渲染位置上而不是绑定在组件函数本身?
围绕“React 为什么说状态是绑定在 UI 树的渲染位置上而不是绑定在组件函数本身”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出同位置渲染同组件则状态保留、不同位置即使同组件也是独立状态,不讨论 key 的显式重置用法。
核心关键词React 状态 绑定 UI 树位置 - 0073
React 的 useSyncExternalStore 中 subscribe 函数何时被调用、其返回的清理函数何时执行?
围绕“React 的 useSyncExternalStore 中 subscribe 函数何时被调用、其返回的清理函数何”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出提交后订阅、快照变化时重新检查、卸载或依赖变化时清理的时序,不讨论 getSnapshot 的返回值要求。
核心关键词useSyncExternalStore subscribe 清理函数 时机 - 0074
React 18 并发渲染下直接用 useState 加外部可变数据读取为什么会出现 tearing(界面撕裂)?
围绕“React 18 并发渲染下直接用 useState 加外部可变数据读取为什么会出现 tearing(界面撕裂)”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出渲染被中断期间外部数据变化导致同屏读到新旧两个值,以及 useSyncExternalStore 如何规避,不展开 SSR 场景。
核心关键词React 18 并发渲染 tearing 外部 store - 0075
深层子组件怎样通过 React Context 更新父层状态？
用主题切换说明深层组件怎样调用 Context 中的 setter、dispatch 或业务命令，区分状态所有权、函数稳定性、函数式更新与直接修改 Context 对象的风险。
核心关键词React Context 子组件更新父组件状态 - 0076
React 中筛选条件、当前标签页这类 UI 状态,什么情况下应该放进 URL 而不是组件 state 或 Context?
围绕“React 中筛选条件、当前标签页这类 UI 状态,什么情况下应该放进 URL 而不是组件 state 或 Cont”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须给出需要刷新保留、可分享链接、前进后退可导航这三条放 URL 的判据及内存态的适用面,不展开路由库 API。
核心关键词React URL 状态 内存 state 可分享 - 0077
React 19 的 use() 相比 useContext 在读取共享数据上多出了什么能力?
围绕“React 19 的 use() 相比 useContext 在读取共享数据上多出了什么能力”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 use 可在条件或循环中调用、且能直接读取 Promise 配合 Suspense,不展开服务端组件的用法。
核心关键词React 19 use() Promise Context 条件读取 - 0078
React 的 useSyncExternalStore 三个参数各自承担什么职责,返回值如何保证一致性?
围绕“React 的 useSyncExternalStore 三个参数各自承担什么职责,返回值如何保证一致性”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答清 subscribe 注册变更通知、getSnapshot 读取当前快照、getServerSnapshot 服务端的职责划分,。
核心关键词useSyncExternalStore subscribe getSnapshot 参数 - 0079
Context Provider 的 value 为什么常用 useMemo？
解释内联对象怎样造成 Context value 身份变化，用完整 JSX 示例区分无关计数更新与真实主题更新，并说明 useMemo 依赖、函数缓存和 React Compiler 的适用边界。
核心关键词React Context Provider value useMemo - 0080
React 中什么信号说明 Context 已经不够用、应该引入带订阅的外部 store?
围绕“React 中什么信号说明 Context 已经不够用、应该引入带订阅的外部 store”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出高频更新、需要字段级订阅或非 React 代码读写这三个触发条件,不展开具体第三方库的 API。
核心关键词React Context 不够用 外部 store 选择器 - 0081
React 什么时候应该用 Context，什么时候继续传 props？
从数据可见性、组件组合、消费范围和测试成本比较 props 与 Context，用局部地区设置示例说明怎样减少无意义的中间传递，同时保留清晰的组件依赖。
核心关键词React Context 和 props 怎么选择 - 0082
React Effect 创建请求时若组件已快速卸载，AbortSignal 已 aborted 的情况下应如何避免把 abort 当成业务错误弹窗？
围绕“React Effect 创建请求时若组件已快速卸载，AbortSignal 已 aborted 的情况下应如何避免”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须区分取消语义与真实失败并尽早返回。
核心关键词React AbortSignal already aborted Effect cleanup 错误处理 - 0083
React 中 requestAnimationFrame 循环驱动画布时，Effect 的 cleanup 取消的是哪一帧，为什么只取消一次可能不够？
围绕“React 中 requestAnimationFrame 循环驱动画布时，Effect 的 cleanup 取消的”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明每帧重新预约导致需保存最新 id 并在 cleanup 取消。
核心关键词React requestAnimationFrame Effect cleanup 取消 循环 - 0084
为什么不能直接把 async 函数传给 React useEffect，又该怎样组织 await 与取消信号？
围绕“为什么不能直接把 async 函数传给 React useEffect，又该怎样组织 await 与取消信号”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 Effect 返回值只能是 cleanup 而非 Promise。
核心关键词React useEffect async Promise cleanup cancel - 0085
两个 React 组件状态需要保持一致时，为什么用 Effect 把一个 state 拷给另一个 state 常是反模式？
围绕“两个 React 组件状态需要保持一致时，为什么用 Effect 把一个 state 拷给另一个 state 常是反”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要明确应提升共享状态或改为派生。
核心关键词React 组件状态同步 Effect 拷贝 state 反模式 - 0086
为什么 React Effect 的清理函数不只在卸载时运行，依赖变化重跑前也运行这一点如何改变资源管理写法？
围绕“为什么 React Effect 的清理函数不只在卸载时运行，依赖变化重跑前也运行这一点如何改变资源管理写法”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答需要围绕必须把资源生命周期绑定到“每次依赖值组合”而非组件存活期。
核心关键词React Effect cleanup 更新前 运行 依赖变化 - 0087
为了让 React Effect 在重复建立/清理下仍正确，清理函数应具备什么样的幂等性设计？
围绕“为了让 React Effect 在重复建立/清理下仍正确，清理函数应具备什么样的幂等性设计”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要明确清理只能撤销本 setup 创建的资源且可安全重复。
核心关键词React Effect 清理 幂等 可重入 - 0088
React useEffect 一定在浏览器绘制后执行吗？
区分 React 渲染、提交与浏览器绘制，解释 useEffect 通常不阻塞绘制但并非保证在绘制后执行，以及浮层测量、useLayoutEffect 和服务端渲染的边界。
核心关键词React useEffect 执行时机和浏览器绘制 - 0089
React 并发特性下，为什么 Effect 代码要假设状态可能被复用或提交前重试，而不是按一次挂载一次卸载写死？
围绕“React 并发特性下，为什么 Effect 代码要假设状态可能被复用或提交前重试，而不是按一次挂载一次卸载写死”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答需要围绕必须落到 setup/cleanup 成对与无全局残留。
核心关键词React 并发 Effect 可重试 状态复用 正确性 - 0090
React 不能按条件调用 useEffect，但只想在某些条件下同步，应把条件放在哪里并保持 Hook 顺序稳定？
围绕“React 不能按条件调用 useEffect，但只想在某些条件下同步，应把条件放在哪里并保持 Hook 顺序稳定”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要明确条件进入 Effect 内部或拆分组件。
核心关键词React 条件 useEffect Hook 顺序 条件逻辑 - 0091
React 自定义 Hook 封装一段 Effect 同步逻辑时，调用方还需要知道哪些依赖和清理约定？
围绕“React 自定义 Hook 封装一段 Effect 同步逻辑时，调用方还需要知道哪些依赖和清理约定”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 Hook 不能隐藏其内部响应式依赖语义。
核心关键词React 自定义 Hook 封装 Effect 依赖 清理 - 0092
useEffect 不写依赖、空数组和具体依赖有什么区别？
按已提交更新解释省略依赖、空依赖和列出具体值时的重同步行为，补充 Object.is、Strict Mode、重新挂载与清理规则，避免把空数组误认为整个应用只执行一次。
核心关键词React useEffect 依赖数组三种写法 - 0093
如何分辨 React 中一次 Effect 重跑是“外部依赖真的变了”还是“Effect 自己 setState 造成依赖又变”？
围绕“如何分辨 React 中一次 Effect 重跑是“外部依赖真的变了”还是“Effect 自己 setState 造”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖回答需要围绕必须建立依赖来源链路并检查是否派生自被更新 state。
核心关键词React Effect 重跑 依赖变化 自身 setState 诊断 - 0094
React 中由 props/state 计算出的值为什么通常不该放进 Effect 再 setState？
React 列表筛选、合计和权限判断怎样从现有 props 与 state 直接计算？结合订单页面解释冗余状态造成的旧值提交、额外更新，以及 useMemo 和用户编辑草稿的适用边界。
核心关键词React 派生状态为什么不需要 useEffect - 0095
React 用 Effect 同步 document.title 时，为什么把 router 对象整个列依赖常导致标题被过度重置？
围绕“React 用 Effect 同步 document.title 时，为什么把 router 对象整个列依赖常导致标”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖判断时要说明真正响应式值是 title 文本/路径片段而非不稳定容器对象。
核心关键词React document.title Effect 依赖 router 对象 - 0096
用户点击触发的逻辑为什么通常放事件处理器，而不是 useEffect？
通过提交反馈、打开详情与保存草稿区分事件因果和持续同步，解释用布尔 state 触发请求的问题、重复提交控制，以及事件更新状态后仍可能需要 Effect 的场景。
核心关键词React 用户操作放事件还是 useEffect - 0097
React Effect 中连续发起请求时，如何防止慢的旧响应覆盖新的结果？
围绕“React Effect 中连续发起请求时，如何防止慢的旧响应覆盖新的结果”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须比较 cleanup 中 abort 与 ignore 标志的适用边界。
核心关键词React Effect fetch 竞态 AbortController ignore - 0098
React 渲染后要把焦点移到新输入框或恢复滚动位置，为什么这些操作适合放 Effect 而不是渲染函数？
围绕“React 渲染后要把焦点移到新输入框或恢复滚动位置，为什么这些操作适合放 Effect 而不是渲染函数”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明 DOM 节点需提交后才存在且命令式操作不应参与渲染计算。
核心关键词React focus scroll Effect commit DOM 副作用 - 0099
在 React 项目里用 eslint-disable 关掉 exhaustive-deps 前，需要确认哪几种情况确实不是隐藏过期数据？
围绕“在 React 项目里用 eslint-disable 关掉 exhaustive-deps 前，需要确认哪几种情况”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须给出可接受例外的窄边界：值非响应式或有意冻结快照。
核心关键词React exhaustive-deps disable 风险 过期数据 - 0100
把地图或图表这类命令式第三方组件接入 React 时，Effect 应负责创建、参数同步和销毁中的哪些边界？
围绕“把地图或图表这类命令式第三方组件接入 React 时，Effect 应负责创建、参数同步和销毁中的哪些边界”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须划分 React 声明式 props 到实例方法调用的同步边界。
核心关键词React Effect 第三方命令式组件 创建 更新 销毁