useEffect - 在 setInterval 中调用一个函数

Question

如何在 useEffect 的 setInterval 中调用函数

useEffect(() => {
        const timeoutId = setInterval(() => {getTime}, 1000); // this is Line 8
        return function cleanup() {
          clearTimeout(timeoutId);
        }
      }, [getTime]);

const getTime=() =>{
            console.log("Inside getTime");}

我希望每 1 秒调用一次我的 getTime 函数。我遇到错误

 Line 8:46:  Expected an assignment or function call and instead saw an expression  no-unused-expressions.

另一个问题，我想每1秒更新一次状态，我可以在setInterval中更新状态吗

Answer 1

如果 getTime() 是 setInterval

的唯一函数，您可以这样做

        const timeoutId = setInterval(getTime, 1000);

或者如果除了 getTime() 之外还有其他命令要在 setInterval 函数中执行，则如下所示。

        const timeoutId = setInterval(() => {getTime()}, 1000);

Answer 2

你的

() => {getTime}

引用 getTime 函数但不对其执行任何操作。您没有调用该函数。这就是 linter 警告您的内容。

为什么不将 getTime 函数单独传递给 setInterval，而不使用不必要的匿名包装器？

const timeoutId = setInterval(getTime, 1000);

另请注意，由于您设置的是间隔，而不是超时，因此您应该使用 clearInterval，而不是 clearTimeout。

can i update state inside setInterval

当然可以，但请记住，如果您想在过程中引用其他状态变量，它们可能不会 up-to-date 在区间的闭包中。如果这是一个问题，也可以使用 refs，或者在状态变量发生变化时清除并重新启动超时。

useEffect - 在 setInterval 中调用一个函数

useEffect - calling a function inside setInterval

javascript

setinterval

reactjs

use-effect