CODEWITHSUNDEEP
reactjsreact-nativeexporeact-navigation
denistepp
denistepp

Reputation: 530

React Native Navigation Without navigation Prop

React Native Docs say that we can use React Navigation without navigation prop. I use it when I click on a notification and redirect to correct screen:

navigationRef.current?.navigate(routes.ROUTE_TO_SCREEN);

However I have cases where I need to navigate more than once (e.g. go to navigator first, then to screen). I thought it would work this way:

navigationRef.current?.navigate(routes.ROUTE_TO_NAVIGATOR);
navigationRef.current?.navigate(routes.ROUTE_TO_SCREEN_INSIDE_NAVIGATOR);

and it works on screen but I get an error first on the console saying:

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

Do you have a screen named 'route_to_screen_inside_navigator'?

Even though it works, I think I am doing something wrong. Should I await the navigation.navigate somehow to make the error go away or is there another way?

I have also checked navigation in nested navigator docs, but didn't quite get how to navigate using params in navigate function.

Edit: After reviewing the link above I have found a solution to one-layer navigator, such as:

navigationRef.current?.navigate(routes.ROUTE_TO_NAVIGATOR, 
    { screen: "route_to_screen_inside_navigator",
});

But that works only for one nested navigator. What if I would want to redirect twice?

Upvotes: 0

Views: 2168

Answers (1)

Moistbobo
Moistbobo

Reputation: 2962

You can keep passing params.screen into the navigate call to continually navigate into deeply nested screens.

Reference

Upvotes: 1

Related Questions