Dhrumil Mayur Mehta
Dhrumil Mayur Mehta

Reputation: 459

Undefined is not a function: Timers - React Native

I am trying to make an app where the SplashScreen is shown for 600 milliseconds and then the Mainscreen is displayed. I used the setTimeOut method in componentDidmount, but I am getting the error as shown here. The necessary code is also provided below.

import React, { Component } from 'react';
import {Image,Dimensions, Button, Text, StyleSheet, View, TouchableOpacity} from 'react-native';
var timePassed;
class SplashScreen extends Component{
constructor(props){
  super(props);
  this.state={
    timePassed: false
  }
}

componentDidMount() {
  this.setTimeout( () => {
     this.setState({timePassed: true})
  },600);
}

render(){
  if(!this.state.timePassed){
  return(
<View style={styles.container}>
 <Image style={styles.logo} source={require('./Images/logo.jpg')}  resizeMode="contain" />
 <Text style={styles.deadlineFont}>Deadline</Text>

</View>
  );
}
else{
  return (
    <View>
    <MainScreen />
    </View>
  );
}
}
  }

Upvotes: 1

Views: 1425

Answers (1)

Andru
Andru

Reputation: 6204

Problem: setTimeout is wrongly called with this but is not a method defined on your class.

Solution: Change this.setTimeout( () => { to setTimeout( () => {.

Here's a working example of your code: https://repl.it/Iqfk/1

Upvotes: 2

Related Questions