react hook倒计时、定时器（短信验证码）

用js写计时器实现倒计时功能很简单，但hooks写的话可能不太一样，这里我已经封装成一个组件了，可以直接copy拿去用

//verifyCode 子组件

let timer = null
const VerifyCode = ({ onClick }) => {
  const [time, setTime] = useState(0)

  useEffect(() => {
    timer && clearInterval(timer);
    return () => timer && clearInterval(timer);
  }, []);

  useEffect(()=> {
    if( time === 60 ) timer = setInterval(()=> setTime(time => --time), 1000)
    else if ( time === 0 ) clearInterval(timer)
  }, [time])

  const getCode = () => {
    // 作为组件使用 
    onClick && onClick(()=> {
      setTime(60)
    })
    //直接使用
    setTime(60)
  }

  return (
    <View onClick={getCode} className=''>
      { time? `${time}秒后获取`: '获取验证码' }
    </View>
  )
}
export default VerifyCode;

// 父组件

const getCode = (call) => {
    call && call()
}
  
<VerifyCode onClick={getCode} />