由于SetInterval中使用了useState，内存使用量不断增加

Question

我设置了一个每 x 秒运行一次的计时器，并将其添加到 UseEffect 内容中。在里面，我更新了 useState 元素，该元素将每 x 秒更新一次。

虽然进程不是很大，但内存使用量从每秒 72 MB 开始增加 1 MB，大约 10 小时后，应用程序因超出内存限制（大约 2 GB）而关闭。

删除 setData 命令后，内存使用量保持恒定为 72 MB。

  const [getData, setData] = useState(0);

  useEffect(() => {
    const interval = setInterval(() => {
      setData(prevData => prevData + 1);
    }, 1000);
    return () => {
      clearInterval(interval);
    };
  }, []);

我尝试了clearInterval方法，但内存使用量仍然增加。

我尝试用setTimeout代替setInterval，结果还是一样。

我尝试使用UseReducer而不是UseState，结果还是一样。

Answer 1

亲爱的MertCelik你可以试试这个:

const countRef = useRef(0);

 useEffect(() => {
 const interval = setInterval(() => {
 countRef.current++;
 }, 1000);
 return () => clearInterval(interval);
 }, []);

或者仍然想使用 useEffect 然后有效地清理：

useEffect(() => {
const interval = setInterval(() => {
setData(prevData => prevData + 1);
}, 1000);
return () => clearInterval(interval); // Clean up on unmount

}, []);