Не определено не является объектом (оценка _this3.props.navigation.navigate)

Question

user.js

  <TouchableHighlight onPress={() => 
         this.props.navigation.navigate('SettingsName') } >
     <Text>Name</Text>
   </TouchableHighlight>

App.js

  import React, { Component } from 'react';
  import { Platform, StyleSheet, Text, View, Image } from 'react-native';
  import { createStackNavigator } from 'react-navigation';
  import LoggedOut from './src/screens/LoggedOut';
  import EnterMobile from './src/screens/EnterMobile';
  import EnterOtp from './src/screens/EnterOtp';
  import SplashScreen from './src/screens/SplashScreen';
  import EventsCalendar from './src/screens/EventsCalendar';
  import LocateMe from './src/screens/LocateMe';                    import 
   SettingsName from './src/screens/SettingsName';
  import SettingsProfilePicture from './src/screens/SettingsProfilePicture';
  import SettingsParking from './src/screens/SettingsParking';

 const AppNavigator = createStackNavigator(
  {
   SplashScreen: {
   screen: SplashScreen
  },
 EnterMobile: {
   screen: EnterMobile
 },
 EnterOtp: {
  screen: EnterOtp
 },
  LocateMe: {
   screen: LocateMe
  },
 UserData: {
   screen: UserData
 },
 SettingsLanguage: {
  screen: SettingsLanguage
 },
 SettingsService: {
   screen: SettingsService
 },
 SettingsHoliday: {
   screen: SettingsHoliday
 }
 },
{
 navigationOptions: {
   header: null
 }
});

export default AppNavigator;

Навигация дается в дочернем компоненте, может ли этовызывать другое поведение?Используя stacknavigator, когда я нажимаю на кнопку, я получаю следующую ошибку

«Не определено не является объектом (оценка this3.props.navigation.navigate)».