我面临着一个很奇怪的问题。下面是代码
const Counter = () => {
const [count, setCount] = useState(0);
useEffect(() => {
const id = setInterval(() => setCount(count => count + 1), 1000);
return () => {
clearInterval(id);
};
}, []);
return <div>{count}</div>;
};
据我所知,由于我给出了一个空数组,因此 useEffect 将仅在第一次渲染后运行。另外,由于我正在清除间隔计数,因此在 COUNT=1 后不得更新计数。 setInterval 似乎仍在连续运行。谁能解释一下吗?
是不是因为我被赋予了 [] 作为 deps,所以间隔在某种程度上没有被清除?
最佳答案
clearInterval(id)
- 这将在组件卸载之前被调用。只要组件未卸载,从 useEffect 返回的函数就不会被调用。因此间隔不会被清除,状态将继续更新,从而计数增加。当组件 Counter
被卸载时,间隔被清除
关于javascript - React hooks useEffect 即使在 [] 作为 deps 的情况下运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59828159/