为什么我的 setInterval 运行在反应钩子中只执行一次？

Question

为什么这段代码只触发一次setInterval然后就停止了...

const MainBar = ()=> {

  const [clock, setClock] = useState("")

  useEffect(() => {
    const interval = setInterval(setClock(clockUpdate()), 1000);
    console.log('Im in useEffect', clock)
  });

...

而将它传递给另一个函数使其每秒都像这样工作？

const MainBar = ()=> {

  const [clock, setClock] = useState("")

  useEffect(() => {
    const interval = setInterval(()=>{setClock(clockUpdate())}, 1000);
    console.log('Im in useEffect', clock)
  });

...

抱歉，我是 hooks 新手 javascript。

Answer 1

您可以通过在 useEffect 中添加第二个参数来尝试此操作，这意味着如果 clock 更改，useEffect 将再次运行

useEffect(() => {
    const interval = setInterval(()=>{setClock(clockUpdate())}, 1000);
    console.log('Im in useEffect', clock)
  }, [clock]);

Answer 2

setInterval 需要传递一个函数才能执行。在这种情况下，它将每秒执行给定的函数。 () => { setClock(clockUpdate()) }其实是一个匿名函数；一个没有名字的函数。如果你给它一个合适的名字，它看起来像 function updater() { setClock(clockUpdate()); }.

setInterval(setClock(clockUpdate()), 1000) 不起作用，因为 setClock(clockUpdate()) 已经执行，甚至在传递给 setInterval 之前。它不能再次将它安排到运行，因为它不是一个函数，它已经是一个结果。

为什么我的 setInterval 运行在反应钩子中只执行一次？

Why does my setInterval run only once in react hooks?

setinterval

reactjs

react-hooks

为什么我的 setInterval 运行 在反应钩子中只执行一次？

Why does my setInterval run only once in react hooks?

setinterval

reactjs

react-hooks

为什么我的 setInterval 运行在反应钩子中只执行一次？