如何在useEffect hook中使用异步函数？

Question

我想在每当某个变量发生变化时执行

calculateWinner()

之后做一些事情。因为

calculateWinner()

函数可以改变一些与我想要做的事情相关的变量的值。

所以，我编码如下：

  useEffect(async () => {
    await calculateWinner();
    setCurrentMove(currentMove + 1);
  },[history])

但是，

终端显示：

Effect callbacks are synchronous to prevent race conditions.

我可以做什么来获取由

calculateWinner()

函数更改的值，然后每当某个变量发生更改时我就可以执行下一步操作？

Answer 1

您无法在

await

中使用

useEffect

功能。

要解决这个问题，你可以像下面这样做。

useEffect(() => {
  (async () => {
    await calculateWinner();
    setCurrentMove(currentMove + 1);
  })();
}, [history]);

此外，您还可以定义异步函数并使用它。

const func = async () => {
  await calculateWinner();
  setCurrentMove(currentMove + 1);
};

useEffect(() => {
  func();
}, [history]);

我想这个答案可以帮助你。

Answer 2

我找到了这个问题的答案。

useEffect(() => {
  async () => {
    const response = await calculateWinner();
  }
  setCurrentMove(currentMove + 1);
}, [history]);