CODEWITHSUNDEEP
javascriptreactjsreact-native
klaba
klaba

Reputation: 23

how to solve Cannot read property 'push' of undefined on react-native?

i'm using RN 0.46.0 and after setup the login component i'm trying to use the navigator to push another component. but shows this

Cannot read property 'push' of undefined

When i click at the button

Even the docs just have this way to get another component.

Someone know if this is related to the version?

Or for Navigation need to create a route?

import React, {Component} from 'react';
import { Text,  View, Navigator, TouchableHighlight } from 'react-native';
import { Card, CardSection, Input, Button } from './common';
import Signup from './Signup';

class Login extends Component {



     goToSignup(){
    this.props.navigator.push({
      component: Signup
    });
  }




    render() {


        return(

            <Card>            

            <CardSection>

            </CardSection>

            <CardSection>
            <Input

            placeholder="Email"
            />

            </CardSection>

            <CardSection>
            <Input
            secureTextEntry

            placeholder="Password"
            />


            </CardSection>

            <CardSection>

            <Button>
            Log In
            </Button>        
            </CardSection>   
            <CardSection>

   <TouchableHighlight onPress={this.goToSignup.bind(this)}>

<Text >
    Go to Sign up
      </Text>       


    </TouchableHighlight>


</CardSection>


</Card>





);

}


}



export default Login;

Upvotes: 2

Views: 1715

Answers (2)

Shubhnik Singh
Shubhnik Singh

Reputation: 1329

React-Native v0.46 doesn't have the Navigator component. It has been removed since v0.44. You have to use other navigation solutions.

React-Navigation ( Recommended, created by the react community )

Other 3rd party solutions:

React Native Navigation

Native Navigation

Upvotes: 2

Dhaval Parikh
Dhaval Parikh

Reputation: 36

here this.props.navigator is undefined make sure this.props.navigator is available to avoid this error you can put one check 

goToSignup(){
 if(typeof this.props.navigator !== "undefined"){
   this.props.navigator.push({
             component: Signup
   });
  }
 }

Upvotes: 0

Related Questions