Reactjs React useState钩子-更新状态时何时使用以前的状态？

在下面的代码中，除非我将前一个状态传递给状态设置调用（“setForm”），否则表单不会正确更新

要查看它的运行情况，请按原样运行代码，控制台将打印“true”，表示它已工作。这是在使用“validate1”函数。如果将其替换为“validate2”（不使用以前的状态），它将无法打印“true”

在validate2中，第二个setForm调用似乎覆盖了第一个setForm调用的form.long状态，因为这些调用是异步的。但是为什么验证1有效呢？为什么使用以前的状态会导致它工作？关于这种行为的任何文档都会非常有用

（我可以通过使用一个设置两个字段的setForm来实现validate2，但下面的代码旨在显示调用setForm的两种方式的差异，包括前一种状态和无前一种状态。）

const{useState，useffect}=React；
函数LoginForm（）{
const[form，setForm]=useState({
用户名：“”，
密码：“”，
long:null
});
useffect（（）=>{
console.log（form.long）；
}，[form.long]）；
常量validate1=（e）=>{
e、 预防默认值（）；
setForm（（prevState）=>({
…国家，
long:form.password.length>=3？真：假
}));
setForm（（prevState）=>({
…国家，
用户名：“******”
}));
};
常数2=（e）=>{
e、 预防默认值（）；
刚毛({
…形式，
long:form.password.length>=3？真：假
});
刚毛({
…形式，
用户名：“******”
});
};
常数更新字段=（e）=>{
刚毛({
…形式，
[e.target.name]：e.target.value
});
};
返回(
用户名：


密码：


提交
);
}
//渲染它
ReactDOM.render(
,
document.getElementById（“react”）
);


为什么validate1可以工作呢？为什么使用以前的状态会导致它工作

第二个
setForm
中
form
的值在下次重新渲染之前仍然是旧值。它不反映以前的
setForm
更新的
表单

React
setState
和
useState
不会直接对状态对象进行更改

setState
和
useState
为React核心创建队列，以更新React组件的状态对象

因此，出于性能原因，更新React状态的过程是异步的。这就是为什么变化不会立即发生的原因

在中，他们提到了以下内容：

如果下一个状态取决于当前状态，建议使用
更新程序函数形式，而不是：

这就是validate1起作用的原因，因为对setForm的第二次调用取决于之前的setForm调用状态，并且如果使用更新程序函数表单，状态将是最新的。
在函数中使用钩子变量将添加依赖项。因此React有一种巧妙的方法，可以使用previous state设置新状态，而无需将旧状态添加为依赖项。我理解validate2（粘贴的代码）失败的原因。我不明白的是validate1为什么会工作，这段代码使用了以前的状态。您在哪里看到了
setForm
中
prevState
的文档？以下是一些来源：和。只需搜索“上一个状态”。@Ravi
validate1
与
prevState
一起工作的原因是，当您已经从输入字段发送了其他更改时，您可以保证将反映上一个状态。@VictorBarros所以使用prevState以某种方式序列化多个状态更新？
setForm({
  ...form,
  long: form.password.length >=3 ? true : false
});
setForm({
  ...form,
  username: "*****"
});

this.setState((state) => {
  return {quantity: state.quantity + 1};
});