My app has a TabNavigator with a StackNavigator in each Tab. I'm not resetting the stacks when navigating between them by clicking on different tabs, so when you change tab, the stack contains the previous state. However, occasionally from within a Screen in one Tab, I want to navigate to a specific Screen in a different tab, and on that occasion, I want to reset the stack in the target Tab.
TabNavigator
Tab1
StackNavigator
- ScreenA
- ScreenB
Tab2
StackNavigator
- Screen1
- Screen2
I want to be able to put a button on Screen2 that resets the Stack on Tab1.
I was wondering if the "target" parameter mentioned in the docs here might help, but there's no examples of how to use it. https://reactnavigation.org/docs/navigation-actions/
(I have searched on here but answers suggested for 4.x don't seem to apply anymore). Thanks!
To reset the navigation stack for the home screen with React Navigation and React Native, we can use the navigation. dispatch and the CommonActions. reset methods. import { CommonActions } from "@react-navigation/native"; navigation.
first time screen init TabA ,user click TabB >> TabB has button click to PageA >> PageB >> PageC ,PageC has a button to reset to Tab. let resetAction = NavigationActions. reset({ index: 0, actions: [ NavigationActions. init({routeName: 'Tab'}), ] }); this.
The reset action wipes the whole navigation state and replaces it with the result of several actions. index - number - required - Index of the active route on routes array in navigation state . actions - array - required - Array of Navigation Actions that will replace the navigation state.
In the end I was able to use the reset
action to do this. I dispatched nested state for the tab I wanted to reset:
navigation.dispatch(
CommonActions.reset({
routes: [
{
name: 'tab-route-name',
state: {
routes: [
{ name: 'stack-route-1' },
{ name: 'stack-route-2' },
{ name: 'stack-route-3' }
]
}
}
]
})
)
It seems to be clever enough that as long as the tab navigator is a parent of the current route, it will find it and reset it.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With