Блог

В App.js У меня есть следующий навигатор стека:

     <NavigationContainer>
      <Stack.Navigator>
        {user ? (
          <Stack.Screen name="Home">
            {(props) => <HomeScreen {...props} extraData={user} />}
          </Stack.Screen>
        ) : (
          <>
            <Stack.Screen name="Login" component={LoginScreen} />
            <Stack.Screen name="Registration" component={RegistrationScreen} />
            <Stack.Screen name="Profile" component={ProfileScreen} />
          </>
        )}
      </Stack.Navigator>
    </NavigationContainer>
  

На рабочем столе я пытаюсь перейти к экрану «Профиль»:

 export default function HomeScreen(props) {
  const onProfilePress = () => {
    props.navigation.navigate('Profile')
  };

  return (
     <View style={styles.container}>
        <TouchableOpacity style={styles.button} onPress={onProfilePress}>
            <Text style={styles.buttonText}>Profile</Text>
        </TouchableOpacity>
     </View>
   );
}
  

Тем не менее, я получаю

 The action 'NAVIGATE' with payload {"name":"Profile"} was not handled by any navigator.
  

Кто-нибудь знает, как исправить?

Profile является только частью стека, когда user имеет значение true. Возможно, вы хотели сделать что-то вроде этого:

 <NavigationContainer>
      <Stack.Navigator>
        {user ? (
<>
          <Stack.Screen name="Home">
            {(props) => <HomeScreen {...props} extraData={user} />}
          </Stack.Screen>
<Stack.Screen name="Profile" component={ProfileScreen} />
</>
        ) : (
          <>
            <Stack.Screen name="Login" component={LoginScreen} />
            <Stack.Screen name="Registration" component={RegistrationScreen} />
          </>
        )}
      </Stack.Navigator>
    </NavigationContainer>