setState 第二个参数的作用？

在 React（类组件中）setState 的第二个参数是一个 回调函数（callback），它会在 状态更新并且组件重新渲染完成后 执行。

基本语法

this.setState(updater[, callback])

• updater：可以是对象（直接更新状态）或函数（根据前一个状态计算新的状态）；

• callback：可选函数，会在状态更新并重新渲染完成后调用。

举个例子

this.setState({ count: this.state.count + 1 }, () => {
  console.log('状态更新完成后的 count:', this.state.count);
});

输出顺序说明：

this.setState({ count: this.state.count + 1 });
console.log(this.state.count); // 这里可能还是旧的值

setState 是异步的，所以如果你想在状态更新后执行逻辑（比如打印最新 state 或调用接口），就需要用第二个参数的回调。

更复杂的情况（函数式 setState）

this.setState(
  (prevState, props) => ({
    count: prevState.count + 1
  }),
  () => {
    console.log('更新后的 count:', this.state.count);
  }
);

这种形式可以安全地基于上一个状态进行更新。

注意

• 第二个参数 只在类组件中生效。

在函数组件中，你应该使用 useEffect 来监听 state 变化：

const [count, setCount] = useState(0);

useEffect(() => {
  console.log('count 更新后:', count);
}, [count]);

总结

参数位置	作用	何时执行
第一个参数	更新状态	异步执行
第二个参数	状态更新、组件重新渲染完成后执行回调	渲染结束后