Javascript React功能组件：clearInterval（）不清除我的间隔

我正在构建一个简单的计时器应用程序。当用户单击播放时，将调用handlePlayPause函数。我已经创建了一个isRunning布尔值来检查计时器是否已经在运行。如果不是，计时器将启动第一部分工作，如果是，则调用pauseTimer函数。最后一个函数将isRunning切换回false，并应清除间隔。但是，间隔不会被清除。你能看出我做错了什么吗

谢谢你的帮助

导出默认功能应用程序{ 常量[sessionLength，setSessionLength]=useState25 常量[breakLength，setBreakLength]=useState5 const[timeLeft，setTimeLeft]=useState25*60*1000 常量[isRunning，setIsRunning]=useStatefalse 设intervalId=null 让handlePlayPause==>{ 如果！正在运行{ setTimeLeftsessionLength*60*1000 游戏计时器 }否则，如果正在运行{ 波塞蒂默 } } 让播放计时器==>{ SetisRunningRue intervalId=setInterval=>{ setTimeLefttimeLeft=>timeLeft-1000 ParseToMinuteSecondTimeLeft }, 1000 } 让pauseTimer==>{ setIsRunningfalse ClearIntervalidIntervalid } 让resetAll==>{ 设置会话长度25 挫折长度5 } 让parseToMinuteSeconds=timeinmillizes=>{ 返回//一个字符串，其时间格式为00:00 } 回来 波莫多罗 计时器 00:00

---

} 我认为问题在于如何存储区间id。当使用函数组件并希望存储实例变量时，我们可以使用useRef钩子

---

在

上有一个与您的用例类似的例子，我认为问题在于如何存储区间id。当使用函数组件和我们想要存储实例变量时，我们可以使用useRef钩子

---

在

上有一个与您的用例类似的示例，如果您提供一个简明的可运行示例，那就太好了possible@tomrlhclearInterval是浏览器API的一部分，与setInterval相同。如果您能提供一个简明的可运行示例，那就太好了possible@tomrlhclearInterval是浏览器API的一部分，与setInterval相同。就这样，我将进一步研究useRef。非常感谢。就这样，我将进一步了解useRef。非常感谢你。

   let intervalId = useRef(null)
  
  let handlePlayPause = () => {
   
    if (!isRunning) {
      setTimeLeft(sessionLength * 60 * 1000)
      playTimer()
    } else if (isRunning) {
      pauseTimer()
    }
  }

  let playTimer = () => {
    setIsRunning(true)
    intervalId.current = setInterval(() => {
      console.log('interval')
      setTimeLeft(timeLeft => timeLeft - 1000)
      parseToMinuteSeconds(timeLeft)
    }, 1000)
  }

    
  let pauseTimer = () => {
    setIsRunning(false)
    clearInterval(intervalId.current)
  }