/Javascript/React/Count down timer in react native

Count down timer in react native

// isResendEnable is just my custom variable to check if i have enabled 
// resend function in my otp box
  const [timerCount, setTimer] = useState(20);
  const [activator, setActivator] = useState(Math.random());
  useEffect(() => {
    let interval;
    if (isResendEnable) {
      interval = setInterval(() => {
        if (timerCount > 0) {
          setTimer(lastTimerCount => {
            lastTimerCount <= 1 && clearInterval(interval);
            return lastTimerCount - 1;
          });
        }
      }, 1000);
    }

    return () => {
      if (isResendEnable) {
        clearInterval(interval);
      }
    };
  }, [activator]);
  
  return <Text> Resend in {timerCount} sec </Text>

React native countdown

import CountDown from 'react-native-countdown-component'; render() {    return (      <CountDown        size={30}        until={1000}        onFinish={() => alert('Finished')}        digitStyle={{backgroundColor: '#FFF', borderWidth: 2, borderColor: '#1CC625'}}        digitTxtStyle={{color: '#1CC625'}}        timeLabelStyle={{color: 'red', fontWeight: 'bold'}}        separatorStyle={{color: '#1CC625'}}        timeToShow={['H', 'M', 'S']}        timeLabels={{m: null, s: null}}        showSeparator      />    )}

-1

Source: npmjs.com

Similar codes

0 vote145 views2 answers
React open pdf in new tab
Javascript React
-2 votes131 views1 answer
How to identify debug and release build in react native
Javascript React
25 votes144 views5 answers
Image react
Javascript React
0 vote138 views1 answer
Multi filtering react
Javascript React
24 votes128 views5 answers
How to change port in react js
Javascript React
11 votes144 views3 answers
Create react tailwind app
Javascript React
5 votes127 views1 answer
Laravel react
Javascript React
0 vote127 views1 answer
Relative width and height image react native
Javascript React
1 vote128 views1 answer
React native header
Javascript React
16 votes120 views3 answers
Loop in react depending on number
Javascript React