title: Why is React Native App.js navigation undefined in App.js?
body: <p><em>export default function App ({navigation})</em></p>
  <p>There is a function that starts with and contains &lt;Stack.Navigator&gt;.</p>
  <p>But when I want to use the navigation feature and use &quot;navigation.navigate ('Lead') in onPress</p>
  <p><em>TypeError: undefined is not an object evaluating react navigation</em></p>
  <p>I get an error. My English is not very good. Please help me on this topic. Now I'm adding the sample codes to you.</p>
  <pre><code>import * as React from 'react';
  import { StyleSheet, AsyncStorage, Alert, View, Image, TouchableOpacity } from 'react-native';
  import { NavigationContainer } from '@react-navigation/native';
  import { createStackNavigator } from '@react-navigation/stack';
  import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
  import { ApplicationProvider, Layout, Input, Button, Text, Spinner, IconRegistry, Icon } from '@ui-kitten/components';
  import { EvaIconsPack } from '@ui-kitten/eva-icons';
  import * as eva from '@eva-design/eva';
  import LinkingConfiguration from './navigation/LinkingConfiguration';
  import * as axios from 'axios';
  import Base64 from './components/Base64';
  import LeadScreen from './screens/LeadScreen';
  import AddLeadScreen from './screens/AddLeadScreen';
  import TabBarIcon from './components/TabBarIcon';
  import HomeScreen from './screens/HomeScreen';
  import CampaignsScreen from './screens/CampaignsScreen';
  import MenuScreen from './screens/MenuScreen';
  
  const Stack = createStackNavigator();
  
  export default function App({ navigation }) {  
    const logout = async () =&gt; {
      await AsyncStorage.removeItem('token');    
      dispatch({ type: 'SIGN_OUT' });
    };
    
    return (    
      &lt;&gt;
        &lt;IconRegistry icons={EvaIconsPack} /&gt;
        &lt;ApplicationProvider {...eva} theme={eva.light}&gt;        
            &lt;Layout style={styles.container}&gt;
              &lt;AuthContext.Provider value={authContext}&gt;
                &lt;NavigationContainer linking={LinkingConfiguration}&gt;
                  &lt;Stack.Navigator&gt;
                    {state.isLoading ? (
                      // We haven't finished checking for the token yet
                      &lt;Stack.Screen name=&quot;Splash&quot; component={SplashScreen} options={{ headerShown: false }} /&gt; 
                      ) : state.token == null ? (
                      // No token found, user isn't signed in
                      &lt;&gt;
                        &lt;Stack.Screen name=&quot;Login&quot; component={LoginScreen} options={{ title: 'Oturum Açın' }} /&gt;                      
                      &lt;/&gt;
                      ) : (
                      // User is signed in
                      &lt;&gt;
                      &lt;Stack.Screen name=&quot;User&quot; component={UserScreen} options={{
                          headerStyle: { backgroundColor: '#e8a200' },
                          headerTintColor: 'white',
                          headerTitleStyle: { color: '#fff' },
                          headerRight: () =&gt; (
                            &lt;TouchableOpacity activeOpacity={0.4} underlayColor='transparent' onPress={() =&gt; logout() } style={{ marginRight: 12 }}&gt;
                              &lt;Icon
                                style={styles.icon}
                                fill='#FFFFFF'
                                name='power-outline'
                              /&gt;
                            &lt;/TouchableOpacity&gt;
                          )
                        }} /&gt;
  
                        &lt;Stack.Screen name=&quot;Lead&quot; component={LeadScreen} options={{
                          title: 'Müşteri Adayları',
                          headerStyle: { backgroundColor: '#e8a200' },
                          headerTintColor: 'white',
                          headerTitleStyle: { fontWeight: 'bold', color: '#fff' },
                          headerRight: () =&gt; (
                            &lt;TouchableOpacity activeOpacity={0.4} underlayColor='transparent' onPress={ () =&gt; console.log(navigation) } style={{ marginRight: 12 }}&gt;
                              &lt;Icon
                                style={styles.icon}
                                fill='#FFFFFF'
                                name='plus-outline'
                              /&gt;
                            &lt;/TouchableOpacity&gt;
                        )}} /&gt;
  
                        &lt;Stack.Screen name=&quot;AddLead&quot; component={AddLeadScreen} options={{ title: 'Müşteri Adayı Ekle' }} /&gt;
                      &lt;/&gt;
                    )}              
                  &lt;/Stack.Navigator&gt;
                &lt;/NavigationContainer&gt;
              &lt;/AuthContext.Provider&gt;
          &lt;/Layout&gt;
        &lt;/ApplicationProvider&gt;
      &lt;/&gt;
    );
  }
  </code></pre>