A cart shows item count and total price, both updating together whenever an item is added.
Click Add Item - Count shows 1, Total shows $0. Click again - Count shows 2, Total shows $10. Total is always one step behind the correct value.
Both `setCount` and `setTotal` run in the same click - what value of `count` does `setTotal` actually see?
Both `setCount` and `setTotal` run in the same click - what value of `count` does `setTotal` actually see?
Why this fixes it
Both `setCount(count + 1)` and `setTotal(total + count * 10)` read from the same pre-batch snapshot - inside a single event handler React does not flush state between calls, so `count` was still `0` when `setTotal` ran. Replacing both calls with functional updaters removes the dependency on the snapshot entirely. React processes functional updaters sequentially against the latest queued state.