Why does setCount(count + 1) three times only increment by one, and how do you fix it?
Quick answer
All three read the same snapshot of count. Use the functional updater setCount(c => c + 1) so each call gets the latest pending value.
In detail
Because count is a fixed value in that render, three calls all compute the same count + 1 and set it to the same number. The functional form receives the previous pending state, so the updates compound correctly. Always use the updater form when the next state depends on the previous.
setCount(count + 1); setCount(count + 1); setCount(count + 1);
// next render: 1, not 3
setCount(c => c + 1); setCount(c => c + 1); setCount(c => c + 1);
// next render: 3💡Rule
If the update reads current state, use setX(prev => …). Always correct.
Why interviewers ask this: The canonical state-batching question.
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