title: undefined is not an object (evaluating '_this2.props.navigation.navigate')
body: <p>When the header is click, I want it navigate to next page. However, I do not know how to access navigation props outside the class. Any suggestion on how to do this?</p>
  
  <pre><code>import React,{Component} from 'react'
  import { View, Text, TouchableOpacity, FlatList} from 'react-native'
  
  class header extends Component {
    render(){
      return(
          &lt;TouchableOpacity
            onPress={() =&gt; **this.props.navigation.navigate('PageTwo')**}
          &gt;
            &lt;Text&gt;{'Go to next Page Two'}&lt;/Text&gt;
          &lt;/TouchableOpacity&gt;
      )
    }
  }
  
  export default class PageOne extends Component {
    static navigationOptions = {
      title: 'Page One',
    }
    constructor(props) {
      super(props);
      this.state = {
        data: // ...
      };
    }
  
    _renderItem = ({item}) =&gt; (
      // ...
    );
  
    render(){
      return(
          &lt;FlatList
            ListHeaderComponent={header}
            data={this.state.data}
            renderItem={this._renderItem}
          /&gt;
      )
    }
  }
  </code></pre>