react runtime_error ai_generated true

错误：重新渲染次数过多。React 限制了渲染次数以防止无限循环。

Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.

ID: react/too-many-re-renders-infinite-loop

其他格式: JSON · Markdown 中文 · English
92%修复率
89%置信度
1证据数
2023-09-12首次发现

版本兼容性

版本状态引入弃用备注
[email protected]+ active — — —
[email protected] active — — —
[email protected] active — — —

根因分析

组件的状态更新触发了重新渲染，而重新渲染又同步触发了另一个状态更新（例如，在 render 函数体中直接调用 setState，或在依赖项不正确的 effect 中调用），导致无限循环。

English

A component's state update triggers a re-render, which in turn triggers another state update synchronously (e.g., setState called directly in the render body or in an effect without proper dependencies), causing an infinite loop.

generic

官方文档

https://react.dev/learn/you-might-not-need-an-effect

解决方案

  1. Ensure state updates are not called directly in the render body. Move them to event handlers or useEffect with proper dependencies.
  2. If using useEffect, ensure the dependency array is correct and does not include variables that change on every render unnecessarily.

无效尝试

常见但无效的做法:

  1. 95% 失败

    There is no configurable limit; React hardcodes the limit to prevent infinite loops. Increasing it would only delay the crash.

  2. 70% 失败

    useCallback does not prevent the infinite loop; it only prevents unnecessary re-creation of functions. The loop is caused by the call itself, not the function identity.

  3. 60% 失败

    While this may break the synchronous loop, it is a hack that leads to unpredictable behavior and does not address the root cause.