用React Hooks 写一个倒计时

定义 state

const [count, setCount] = useState(0)

使用 useEffect

useEffect(() => {
        return () => {
            clearInterval(intervalRef.current);
        };
    }, []);

    useEffect(() => {
        if (count === 59) {
          intervalRef.current = setInterval(() => {
            setCount((preCount) => preCount - 1);
          }, 1000);
        } else if (count === 0) {
          clearInterval(intervalRef.current);
        }
 }, [count]);

使用

<TouchableOpacity
  style={styles.sendCode}
  activeOpacity={1}
  onPress={handleSendCode}
  disabled={disabled}>
    <View style={styles.timerBox}>
       <Text style={styles.timerText}>
            {count ? `${count}秒后获取` : '获取验证码'}
       </Text>
    </View>
  </TouchableOpacity>

// 方法调用
const handleSendCode =useCallback(() => {
    setCount(59);
}, [])