I have a main navigator and two navigators nested in it: Auth Navigator and a Root navigator that renders a different screen depending on whether a user exists or not. But It returns this error when I try to navigate to either of the screens:
The action 'NAVIGATE' with payload {"name":"UserType1"} was not handled by any navigator
This is my main Navigator:
function _Navigation({ colorScheme, tokenRedux,}: { colorScheme: ColorSchemeName; tokenRedux: any;}) { const [userExists, setUserExists] = React.useState<boolean>(false); const [user, setUser] = React.useState<any>(); const getUser = async () => { const user = await getDataInStorage("USER_AUTH"); if (user?.data?.username) { setUserExists(true); } else { setUserExists(false); } setUser(user); return user; }; React.useEffect(() => { getUser(); }, [tokenRedux]); return (<NavigationContainer linking={LinkingConfiguration} theme={colorScheme === "dark" ? DarkTheme : DefaultTheme}> {userExists ? <RootNavigator user={user} /> : <AuthNavigator />}</NavigationContainer> );}
This is my Root Navigator(Where the problem lies):
function RootNavigator(user: any) { const currentUser = user?.user?.data; return (<Stack.Navigator> {currentUser && currentUser?.userType === "influencer" ? (<Stack.Screen name="UserType1" component={UserType1BottomTabNavigator} options={{ headerShown: false }} /> ) : (<Stack.Screen name="UserType2" component={UserType2BottomTabNavigator} options={{ headerShown: false }} /> )}<Stack.Screen name="Profile" component={ProfileOverview} options={{ headerShown: false }} /><Stack.Screen name="BioData" component={BioData} options={{ headerShown: false }} /><Stack.Screen name="NotFound" component={NotFoundScreen} options={{ title: "Oops!" }} /> {/* <Stack.Group screenOptions={{ presentation: "modal" }}><Stack.Screen name="Modal" component={ModalScreen} /></Stack.Group> */}</Stack.Navigator> );}
When I try to navigate to either the userType1 or userType2 screen, it returns an error:
The action 'NAVIGATE' with payload {"name":"UserType1"} was not handled by any navigator