前端知库

为什么调用 setState 后,当前变量还是旧值?

理解状态快照、更新队列和函数式更新。

参考答案

一次渲染中的状态是快照。调用状态更新函数会请求后续渲染,不会修改当前闭包里的变量。React 会在适当时机批处理更新。

JSX
setCount(c => c + 1);
setCount(c => c + 1);
setCount(c => c + 1);
// 连续应用更新函数,增加 3

如果连续三次执行 setCount(count + 1),这三次读取的是同一个渲染快照,通常只增加 1。新状态依赖前一个状态时,使用函数式更新。