Question 34947 in React native Question posted in
The official React Native documentation can be found here.

How can get route name of a double nested screen in React Native

enter image description here

In StackScreenΑ if get route name I will take StackScreenΒ1 or StackScreenΒ2 depending on which page I’m on.

The same in StackScreenB1 if get route name I will take ScreenC1 or ScreenC2 or ScreenC3 depending on which page I’m on.

Is there any way when I am on StackScreenΑ to get route name on Nested Screens of StackScreenB1.

Explain. I am on stage A and I want to get the route name of stage C and not B.

*For get route name of B when I am on A , alert(route.name)

Tags:

2

Answers


  1. 0

    I had struggle with the nav as well. I made this post, and finally understood how to nest different navigations:
    https://stackoverflow.com/a/72834227/8119333
    In this, I made a stack nav into a bottom tab nav. I think you can do exactly de same with 2 stack nav and navigate from anywhere to anywhere.

    so when you declare your route a the very top of you app:

    <NavigationContainer>
        <Stack.Navigator>              
          <Stack.Screen name='screenA' component={ComponentA} />
          <Stack.Screen name='screenB' component={ComponentB} />
          <Stack.Screen name='screenC' component={ComponentC} />
        </Stack.Navigator>
      </NavigationContainer>

    Your route names are screenA , screenB and screenC

    Login or Signup to reply.
  2. 0

    I had the same problem and was able to make it work using the following code.

    AppContext.js

    export default AppContext = { navigationRef: null };

    App.js

    ...
<NavigationContainer ref={ref => AppContext.navigationRef = ref}>
...

    YourFile.js

    console.log(AppContext.navigationRef?.getCurrentRoute().name);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search