Javascript 反应设定间隔

我想做一个函数，它每秒增加一个时间变量。所以我这样做：

 const [time, setTime]=useState(0)
function startRecord(){
start()
setClicked(true)
setInterval(()=>{
    setTime(prev=>prev+1)

},1000)
}

function stopRecord(){
setTime(0)
 stop()
 setClicked(false)
}

但我遇到的问题是，每当我重置时间

setTime（0）

，然后重新设置时间，由于某种原因，显示的

时间每毫秒递增一次。
以下是一段视频：
知道发生这种情况的原因吗？
将间隔ID存储在状态（或ref）中，当您执行
设置单击（false）
时，也要清除间隔：

const [time, setTime] = useState(0)
const [intervalId, setIntervalId] = useState();
function startRecord() {
    start()
    setClicked(true)
    setIntervalId(setInterval(() => {
        setTime(prev => prev + 1)
    }, 1000));
}

function stopRecord() {
    setTime(0)
    stop()
    setClicked(false)
    clearInterval(intervalId);
}

将间隔ID存储在状态（或ref）中，当执行设置单击（false）

时，还应清除间隔：

const [time, setTime] = useState(0)
const [intervalId, setIntervalId] = useState();
function startRecord() {
    start()
    setClicked(true)
    setIntervalId(setInterval(() => {
        setTime(prev => prev + 1)
    }, 1000));
}

function stopRecord() {
    setTime(0)
    stop()
    setClicked(false)
    clearInterval(intervalId);
}