How to resolve React-Native navigation error for undefined is not an object?

Question

Here's my code. I have tried many different things based on react-navigation and navigators but still getting Undefined is not an object(evaluating _this3.props.navigation.navigate).

I even tried restarting the package manager and running project again. I am running my project on Android Device.

Please help with relevant lines to my code.

    import React, { 
   Component 
} from 'react';

import {
   AppRegistry,
   StyleSheet,
   Text,
   View,
   Image,
   Button,
   Alert,
} from 'react-native';

import { 
   StackNavigator, 
} from 'react-navigation';

import ProfileScreen from './ProfileScreen'
//import HomeScreen from './HomeScreen'


export const AwesomeProject = StackNavigator({ 
   //Home: {screen: HomeScreen}, 
   Profile: {
      screen: ProfileScreen,
      navigationOptions : { 
      title: 'Welcome', 
      }
   }, 
});

const onButtonPress = () => { 
   Alert.alert('Button has been pressed!'); 
};


class Blink extends Component {

   constructor(props) {
       super(props);
       this.state = {
         showText: true
      };

      // Toggle the state every second
       setInterval(() => {
         this.setState({ 
               showText: !this.state.showText 
         });
       }, 1000);
   }

   render() {
      let display = this.state.showText ? this.props.text : ' ';
      return (
            <Text> {display} </Text>
      );
   }
}


export default class HomeScreen extends Component {

   constructor(props){
      super(props)
   }

   render() {

      //const {navigate} = this.props.navigation;

      return (

            <View style={styles.container}>

               <Text style={styles.welcome}>
                     <Blink text='Hello!'/>
               </Text>

               <Button
                  //onPress = {onButtonPress} 
                  onPress = {() => this.props.navigation.navigate('Profile').bind(this)} 
                  title="Lets Go!" 
                  color="#851884" 
                  accessibilityLabel="Learn more about people">
               </Button>

            </View>
      );
   }
}

const styles = StyleSheet.create({

   container: {
       flex: 1,
       justifyContent: 'center',
       alignItems: 'center',
       backgroundColor: '#456987',
   },

   welcome: {
       fontSize: 20,
       textAlign: 'center',
       color: '#DD5522',
       margin: 10,
   },

});