React中Hooks封装倒计时60S

使用hooks对倒计时进行封装（TS版），结合useState，useEffect，useRef 以及定时器setInterval

1. useState对count进行数据初始化,后边结合setcount()方法对count进行修改
2. useRef是作为定时器的一个Id，便于后面清除定时器
3. 第一次的useEffect是作为定时器的启动，传入一个空数组【】，不依赖任何项，只调用一次
4. 第二次的useEffect是作为清除定时器使用，依赖于count的变化，故传入一个包含count的数组

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

export default function useTimes(start:number) {
    const [count,setcount] =useState(start)
    const timerRef=useRef<NodeJS.Timer>()
        
    useEffect(()=>{
        timerRef.current=setInterval(()=>{
            setcount(c=>c-1)
        },1000)
        //清除副作用
        return ()=>{
            clearInterval(timerRef.current)
        }
    },[])
    useEffect(()=>{
        if(count===0){
            clearInterval(timerRef.current)
        }
    },[count])
    return count
}