undefined is not an object (evaluating '_this2.props.navigation.navigate') - React Native

Apart from react-navigation, I was also using react-native-scrollable-tab-view.

I have solved it by passing the navigation props through the tab navigation:

<CalendarScreen navigation={this.props.navigation} tabLabel="Agenda"/>

Then you can access it in the other components as this.props.navigation as well.

I changed my method from renderHeader(){ ... } to

renderHeader = () => {
    const title= 'Sign Up';
    return (
      <View style={{
        padding: 20,
        flex: 1,
        flexDirection: 'row',
        justifyContent: 'space-between'
      }}>
        <Icon
          onPress={() => {
                           this.props.navigation.navigate('find');
                         }
                  }
          name='arrow-back'
          type='MaterialIcons'
          color='white'
        />
      </View>
    );
} 

it solved this problem.

use renderHeader = () => {} instead of using renderHeader(){} is critically important in solving my issue.