CODEWITHSUNDEEP
javascriptreact-nativereact-navigation
Zennichimaro
Zennichimaro

Reputation: 5306

React Native navigate from StackNavigator to another StackNavigator or TabNavigator

I am new to react native and react-navigator and would like to achieve this setup:

  1. I already have SignUpScreens, from SignUpScreen01 - SignUpScreen05 which are all embedded into one StackNavigator, I have no problem with that, and the last one (SignUpScreen05) is actually the content of the app itself
  2. Now for the returning user, I have one LoginScreen, which should skip directly to SignUpScreen05 (content, which is a TabNavigator) upon successful login.

I have no idea how to linked those up. If I put LoginScreen into my StackNavigator, I can navigate everything correctly, but during the signup process, user can goBack to the LoginScreen. SignUpScreen05 (content) user can also goBack to SignUpScreen which is not correct.

If I don't put them into the StackNavigator, I have no idea how to navigate from the LoginScreen. If possible, those (content and login) shouldn't be in the StackNavigator as I think those should be in different module, but I am not really sure how this should actually be done in react-navigator..

Any ideas? Thanks in advance!

Upvotes: 1

Views: 406

Answers (1)

Jenny Kim
Jenny Kim

Reputation: 1565

You will probably need to nest your navigators

  1. Your first StackNavigator will contains all the signup process + content (SignUpScreen01 to SignUpScreen05)

  2. You'll have another StackNavigator, which is configured with {headerMode: "none"} that contains:

-. your LoginScreen

-. your StackNavigator (SignUpScreen01..05)

-. your content (SignUpScreen05)

I know there seems to be duplication of your content, but it should be ok (I guess), since they are using the same component (and thus the same code), CMIIW or if somebody else has a better idea

Btw, the idea is similar to the solution proposed by the duplicated question :)

https://stackoverflow.com/a/44210967/474330

Upvotes: 1

Related Questions