CODEWITHSUNDEEP
react-nativereact-navigation
patdugan
patdugan

Reputation: 797

How can I reset to a screen in a different stack with react-navigation?

I have a Settings screen in one Stack.Navigator that allows a user to logout. I would like for that logout action to reset the user to a SignIn screen that sits inside a different Stack.Navigator.

Whats the correct way to do this with react-navigation 5.X?

Upvotes: 1

Views: 645

Answers (1)

patdugan
patdugan

Reputation: 797

You can do this by specifying in the reset action first to the route for the stack, and then as a child of that route, the route to the specific screen within the stack's state.

In the example below, this reset action sets the stack index to 0 and navigates the user to a separate 'Home' stack, of which the screen 'Landing' is a child.

import { CommonActions } from '@react-navigation/native';

navigation.dispatch(
    CommonActions.reset({
        index: 0,
        routes: [
            {
                name: 'Home',
                state: {
                    routes: [{ name: 'Landing' }],
                },
            },
        ],
    }),
);

Upvotes: 2

Related Questions