小编Rya*_*fer的帖子

我正在使用 React 构建一个简单的时钟应用程序。目前该countDown()功能有效，但我希望用户能够通过按下按钮来停止/启动时钟。我有一个名为的状态布尔值，paused当用户单击按钮时该状态布尔值会反转。问题在于，在 的值反转后，对传递给的函数内部paused的引用似乎正在访问 的默认值，而不是更新后的值。pausedcountDown()setInterval()paused

function Clock(){
  const [sec, setSecs] = useState(sessionLength * 60);
  const [paused, setPaused] = useState(false);
 
  const playPause = () => {
    setPaused(paused => !paused);
  };
  
  const countDown = () => {
    if(!paused){
        setSecs(sec => sec - 1)
      }
  }
  
  useEffect(() => {
    const interval = setInterval(() => {
        countDown();
    }, 1000);
    return () => {
      clearInterval(interval);
    };
  }, []);

setState()我假设它与 React 中调用的异步性质和/或使用正则表达式时范围/上下文的性质有关。然而，我无法通过阅读与这些概念相关的文档来确定发生了什么。

我可以想到一些解决方法，让我的应用程序能够按需要运行。但是我想了解我当前的方法有什么问题。我将不胜感激任何人都可以阐明这一点！