title: React Native - navigation issue "undefined is not an object (this.props.navigation.navigate)"
body: <p>Im following this tutorial <a href="https://reactnavigation.org/docs/intro/" rel="noreferrer">https://reactnavigation.org/docs/intro/</a>  and im running into a bit of issues.</p>
  
  <p>Im using the Expo Client app to render my app every time and not a simulator/emulator.</p>
  
  <p>my code is seen down below. </p>
  
  <p>I originally had the  "SimpleApp" const defined above "ChatScreen" component  but that gave me the following error:</p>
  
  <blockquote>
    <p>Route 'Chat' should declare a screen. For example: ...etc</p>
  </blockquote>
  
  <p>so I moved the decleration of SimpleApp to just above "AppRegistry" and that flagged a new error </p>
  
  <blockquote>
    <p>Element type is invalid: expected string.....You likely forgot to export your component..etc</p>
  </blockquote>
  
  <p>the tutorial did not add the key words "export default" to any  component which I think it may have to do with the fact that im running it on the Expo app? so I added "export default" to "HomeScreen" and the error went away.</p>
  
  <p>The new error that I cant seem to get rid off(based on the code below) is the following:</p>
  
  <blockquote>
    <p>undefined is not an object (evaluating 'this.props.navigation.navigate')</p>
  </blockquote>
  
  <p>I can't get rid of it unless I remove the "{}" around "const {navigate}" but that will break the navigation when I press on the button from the home screen</p>
  
  <pre><code>import React from 'react';
  import {AppRegistry,Text,Button} from 'react-native';
  import { StackNavigator } from 'react-navigation';
  
  export default class HomeScreen extends React.Component {
    static navigationOptions = {
      title: 'Welcome',
    };
    render() {
      const { navigate } = this.props.navigation;
      return (
        &lt;View&gt;
          &lt;Text&gt;Hello, Chat App!&lt;/Text&gt;
          &lt;Button
            onPress={() =&gt; navigate('Chat')}
            title="Chat with Lucy"
          /&gt;
        &lt;/View&gt;
      );
    }
  }
  
  
  
  class ChatScreen extends React.Component {
    static navigationOptions = {
      title: 'Chat with Lucy',
    };
    render() {
      return (
        &lt;View&gt;
          &lt;Text&gt;Chat with Lucy&lt;/Text&gt;
        &lt;/View&gt;
      );
    }
  }
  
  const SimpleApp = StackNavigator({
    Home: { screen: HomeScreen },
    Chat: { screen: ChatScreen },
  });
  AppRegistry.registerComponent('SimpleApp', () =&gt; SimpleApp);
  </code></pre>