What causes the 'Too many re-renders' error?
Quick answer
Calling a state setter directly during render (instead of in a handler/effect), creating an infinite render loop.
In detail
Setting state during render triggers another render, which sets state again, forever. Usually it's onClick={setX(1)} (called immediately) or a setState in the component body without a condition. Fix by passing a function (() => setX(1)) or moving the update into an effect with correct dependencies.
// ❌ runs during render -> loop
<button onClick={setOpen(true)}>Open</button>
// ✅
<button onClick={() => setOpen(true)}>Open</button>Why interviewers ask this: A real error candidates must be able to diagnose instantly.
This is 1 of 118+ questions in the React Interview Kit
Get every question with detailed answers, follow-ups and real code — plus coding challenges and a last-minute revision sheet. One-time payment, instant access.
⚡ Get the React Interview Kit → ₹399