React正在使用useEffect在setInterval内部丢失状态

import React, { useState, useEffect, useRef } from 'react';

const MyComponent = () => {
  const [count, setCount] = useState(0);
  const countRef = useRef(count); // 使用useRef存储状态值的引用

  useEffect(() => {
    countRef.current = count; // 更新countRef的值为最新的count
  }, [count]);

  useEffect(() => {
    const interval = setInterval(() => {
      // 使用countRef.current来获取最新的count值
      console.log(countRef.current);
    }, 1000);

    return () => {
      clearInterval(interval); // 在组件卸载时清除定时器
    };
  }, []);

  return (
    <div>
      <button onClick={() => setCount(count + 1)}>增加</button>
      <button onClick={() => setCount(count - 1)}>减少</button>
    </div>
  );
};

export default MyComponent;