skip to Main Content

I’m new to React Native, and want to build a login page that connects to the home page, but if I use a single stack navigator, I get the little arrow in the top lefthand corner that just allows the user to go back to the login page without clicking on the logout button, which wouldn’t log them out correctly. How can I make it so that arrow goes away on the Home Screen? Do I need to make 2 stack navigators and link them together somehow? I don’t have any code written yet, I’m just looking for a general explanation before I get started.

2

Answers


  1. Chosen as BEST ANSWER

    Got it, need to set "headerLeft" to null in the Stack Screen


  2. You can also check the documentation of React Navigation authentication flow
    according to the documentation Don’t manually navigate when conditionally rendering screens between Auth and Home screens.

    isSignedIn ? (
      <>
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Profile" component={ProfileScreen} />
        <Stack.Screen name="Settings" component={SettingsScreen} />
      </>
    ) : (
      <>
        <Stack.Screen name="SignIn" component={SignInScreen} />
        <Stack.Screen name="SignUp" component={SignUpScreen} />
      </>
    );
    

    Full documentation of React Navigation

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search