React State Not Updating? What to Check
State is often updating. The component is reading the wrong reference, render, or owner.
By Shadorux · · 6 min read · React · JavaScript
Ask two questions: did the setter run, and did the next render receive a new value? Logging both sides separates an event problem from a rendering problem.
Check mutation first
Mutating an object or array in place can leave React looking at the same reference.
// New reference, new render signal
setUser(current => ({ ...current, name: "Shadow" }));Use functional updates
When the next value depends on the previous value, use the functional setter so batching cannot make the update stale.
setCount(value => value + 1);Fast isolationRender the value beside the control that changes it. If it moves, the bug is downstream in derived data or CSS.
Confirm the owner
Check props at the receiving component, then check whether memo or a custom comparison is rejecting the render.
Still stuck with a React or Next.js bug? See React & Next.js debugging help.
Related notes
React Component Not Re-rendering? Common Causes
How to Debug an Infinite useEffect Loop