How to Use Set Timeout in React Native

Sometimes, we may need to execute code after some delay. In such cases, we use JavaScript method setTimeout in React Native. The setTimeout method is used to execute a function after waiting a specific amount of time.

See the following snippet to see how we use the setTimeout method. The yourFunction will execute only after 3000 milliseconds, that is 3 seconds.

setTimeout(() => {
yourFunction();
}, 3000);

In the following react native setTimeout example, the alert will appear on the screen when the time period of 5 seconds finishes.

import React, {useEffect} from 'react';
import {View, Text, Alert} from 'react-native';

const App = () => {
  useEffect(() => {
    setTimeout(() => {
      Alert.alert('I am appearing...', 'After 5 seconds!');
    }, 5000);
  }, []);
  return (
    <View style={{justifyContent: 'center', alignItems: 'center'}}>
      <Text style={{color: 'black'}}>Alert will appear after 5 seconds</Text>
    </View>
  );
};

export default App;

This is how you use the setTimeout method in React Native. The output is given below.

react native settimeout

If you have any doubts then don’t hesitate to use the comment section.

Similar Posts

One Comment

Leave a Reply