undefined is not an object(evaluating this.props.navigator.push)
<p>I have two page i.e sign in page and a payment page.
I am trying to navigate to payment page on tap on SignIn button, but i am getting error undefined is not an object(evaluating this.props.navigator.push)</p>

<p>The code is as below:</p>

<pre><code>import React, {
StyleSheet,
Text,
View,
TextInput,
Component,
Alert,
Navigator
} from 'react-native';

var Button = require('react-native-button');
import Payments from '../payments'


class Signin extends Component{


 onSubmitPressed(){
    this.props.navigator.push({
        title: 'secure Page',
        component: &lt;Payments/&gt;

    });


  };

render() {
return(

 &lt;View style={styles.container}&gt;
&lt;View style={styles.Inputview}&gt;
&lt;TextInput id='user' style={styles.input}
placeholder={'Username'}
/&gt;
&lt;TextInput id='Password' secureTextEntry={true}
placeholder={'Password'}
onChangeText={password =&gt; this.setState({password})}
/&gt;
&lt;/View&gt;

&lt;View &gt;
 &lt;Button style={styles.Register}  
 onPress={(this.onSubmitPressed)}&gt;
  Sign In
  &lt;/Button&gt;
 &lt;/View&gt;
 &lt;/View&gt;
 )
  }
 }


 export default Signin


If any one let me know how to solve this issue??
</code></pre>