react-hooks-js/set-state-in-render
Validates against setting state during render, which can trigger additional renders and potential infinite render loops
- Category: React Compiler
- Severity: error
- Source:
eslint-plugin-react-hooks - Framework: global
- Enabled when: eslint-plugin-react-hooks v6+ installed AND React Compiler detected in project
- Documentation: https://react.dev/reference/eslint-plugin-react-hooks/lints/set-state-in-render
Validation prompt
Use this to decide whether a fired diagnostic is real or a false positive.
Fires on UNCONDITIONAL setState during render — guaranteed infinite loop. The conditional sync-state-to-prop pattern (if (items !== prevItems) { setPrevItems(items); setSelection(null); }) is explicitly allowed and is the documented escape hatch. False positive: rare; bare setState in the component body is almost always a real bug.
Fix prompt
Use this once validation confirms the diagnostic is real.
Move the setState into an event handler (onClick, onChange, onSubmit) or into useEffect if it must run after commit. To synchronize state with a prop change across renders, use the gated pattern above — store the previous prop in state and only call setState when it differs. For clamping or derived values, derive during render instead of mirroring into state. See https://react.dev/reference/eslint-plugin-react-hooks/lints/set-state-in-render