Unable to pass params to all the createMaterialTopTabNavigator children

[brbrr]

Current Behavior

When I navigate to createMaterialTopTabNavigator passed params are not shared to its children. When I navigate to some of the children of createMaterialTopTabNavigator - params are not shared with other children

Expected Behavior

When I navigate to createMaterialTopTabNavigator - params passed are passed to its children, so I can share data with all the screens inside TabNavigator

How to reproduce

Snack: https://snack.expo.io/S1Odm_XBm https://snack.expo.io/r1imvK7SQ

• Click on 'EventsScreen' to navigate further. check if navigation.state.params printed on both screens.
• Update navigation.navigate('EventTab', {test: 1} ) to navigation.navigate('Event', {test: 1} ), and check if navigation.state.params printed on both screens

Your Environment

software	version
react-navigation	2.11.2
react-native	0.55.4
node	v10.4.1
npm or yarn	npm v6.1.0

[eriveltonelias]

Hi @brbrr !

You're getting this problem because you're calling the child screen first. So to fix that, basically call the EventStack

I fixed your example and now it's working, please check it on

https://snack.expo.io/rkAeGYQrQ

[brbrr]

Thanks, @eriveltonelias, but it looks like you updated my navigators set up. I actually omitted some of the screens in these navigators for simplicity sake.
Here is updated snack, now with specified modal screen: https://snack.expo.io/r1imvK7SQ

[eriveltonelias]

@brbrr gotcha.

I follow your code and fix with your new update, try again, please.

https://snack.expo.io/r1UZC5QSm

[brbrr]

oh, that's works now, Thanks! But it looks like it screws up the navigation.goBack() for my NewExpenseScreen - which is basically a modal that should appear on top of Event or ExpensesList screens. goBack now just do nothing 🤷‍♂️

[shuuha]

I am having identical issue. When I am navigating to the TopTabNavigation the children of the TabNavigation are not receiving the params I am passing.

Here is how my routers are configured:

const TopTabNav = createMaterialTopTabNavigation({
Dashboard: { screen: Screen1 },
Menu: { screen: Screen2 }
)}

const BottomNavigation = createBottomTabNavigation({
Home: { screen: TopTabNav },
Chat: { screen: ChatScreen },
Support: { screen: SupportScreen }
)}

RootStack: {
Loading: { screen: LoadingScreen },
MainNav: { screen: BottomNavigation }
}

So I am doing navigation.navigate(MainNav, { test: 1}), and I am taken as expected to the required route i.e TopTabNav but the children of the route (Dashboard and Menu screens) are not getting the params.

I also tried to navigation.navigate(TopTabNav, { test: 1 }), but I am also getting same result, no params passed to the children of TopTabNav.

What am I doing wrong here? Very much appreciate any help.

[brentvatne]

this.props.navigation.dangerouslyGetParent().getParam(...)

[ProfessionalAmateur]

Is there a way to find what version the dangerouslyGetParent() was available? I seems I cannot get the dangerouslyGetParent.getParam('PARAM') to work correctly. the dangerouslyGetParent() does bring back data and if I provide a literal path I can get to my params but not using getParam() Here is a snack showing what happens

[brentvatne]

@ProfessionalAmateur - you should update to react-navigation@3. i can't recall which version it was added in but if you look through code at the various tags here on https://github.com/react-navigation/react-navigation/releases you can find it

[anastely]

@brentvatne if I have two AppContainer how to get params from the other screen in separate other AppContainer?

[sorakrisc]

@brbrr gotcha.

I follow your code and fix with your new update, try again, please.

https://snack.expo.io/r1UZC5QSm

look very promising at first but if u change

initialRouteName : 'NewExpense' inside EventStackNavigator
to
initialRouteName : 'EventTab'

you will get undefined