Sometimes, we want to reset the navigation stack for the home screen with React Navigation and React Native.
In this article, we’ll look at how to reset the navigation stack for the home screen with React Navigation and React Native.
How to reset the navigation stack for the home screen with React Navigation and React Native?
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.
For instance, we write
import { CommonActions } from "@react-navigation/native";
navigation.dispatch(
CommonActions.reset({
index: 1,
routes: [
{ name: "Home" },
{
name: "Profile",
params: { user: "jane" },
},
],
})
);
to call navigation.dispatch with the object returned by the CommonActions.reset method.
We call CommonActions.reset with an object that resets the navigation state of the app to the have the Home and Profile routes.
The existing navigation state is replaced with the items we called CommonActions.reset with.
Conclusion
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.
