后坐力状态未正确更新

Question

我有以下代码。

const [verificationValues, setValues] = useRecoilState(verificationFormValues);
setValues({
   ...verificationValues!,
   nidOrPassport,
   addressProof,
   recentPhoto,
   bankAccountStateMents,
   businessProof,
   salarySlip,
   employeeIdCard,
});

提交表单后，我将调用 setValues 函数。当我在控制台记录此验证值时，它没有更新验证值。但是，如果我在提交处理程序之后控制台记录值，那么它就会工作并显示更新的值。另外，我刚刚注意到它在我再次按下提交按钮后才起作用。此外，setValues 函数不是异步的，需要一些时间才能完成。那么为什么会发生这种情况呢？我现在很困惑。提前致谢。

重要的

那些nidOrPassport、addressProof、recentPhoto等都是对象

Answer 1

事实证明这实际上是一个react问题。setValues 正在更新值，但更新后的值只能在下一次渲染时访问。所以我必须使用 useEffect 挂钩，现在它可以工作了。

useEffect(() => {
    console.log(verificationValues);
  }, [verificationValues]);

2022 年 7 月更新

React Now 支持自动批处理。因此，如果您使用 React 18 或更早版本，则可以通过使用lushSync来避免此问题。

在 Github 讨论中了解更多信息