在用于设置状态的函数内访问状态

Question

我想在用来更新状态的函数中访问状态的更新值。

const [test , setTest] = useState("old val");

const run = () => {
    setTest("new val");
    console.log(test);
}

这给了我测试的旧价值，即“旧值”。如何访问在函数run中设置的新值。

为此，我经历了几个StackOverflow问题。我到处都找到1个常见的解决方案，它可以完成以下任务：

setTest("new val" , () => {
 console.log(test);
})

但是当我这样做时，我没有得到想要的结果，但是得到了警告，提示是useState() hooks do not take the second parameter callback arg.

有人可以帮我吗？

Answer 1

您正在面对此问题，因为useState钩子是异步的。 有两种解决方案： 使用async / await

const run = async () => {
    await setTest("new val");
    console.log(test);
}

您还可以使用useEffect钩访问最新状态更新，我建议您使用这种方法在测试值更改时触发您的操作。

useEffect(() => {
  console.log(test);
  // Do whatever you want with the new value here
}, [test]);