Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

go two screen back with single press event using react-navigation in react native app

I am using reactnavigation component from https://reactnavigation.org and using the code below i am going one screen back

<Button
          onPress={() => goBack()}
          title="Go back from this HomeScreen"
        />

how can i go 2 screen back on single press action

I am using this code to initialize the navigator

const RouteConfigs = {
    Login: {screen:Login},
    Home: {screen:Home},
    Chat: {screen:Chat},
    Facebook: {screen:Facebook},
    Facebookgallery: {screen:Facebookgallery}    
}

const StackNavigatorConfig = {
    headerMode: 'none',
}

export default StackNavigator(RouteConfigs, StackNavigatorConfig)

I navigate from home to Facebook with this code :

() => this.props.navigation.navigate('Facebook', {user:this.state.user})

and from Facebook to Facebookgallery with this code :

onPress={ () => this.props.navigation.navigate('Facebookgallery', {user:this.state.user}) }

now i want to go back from Facebookgallery to Home directly with some parameters

like image 482
Abhishek Kumar Avatar asked May 10 '17 14:05

Abhishek Kumar


People also ask

How do you go back to previous screen in React Native?

You can go back to an existing screen in the stack with navigation. navigate('RouteName') , and you can go back to the first screen in the stack with navigation. popToTop() .

How do you navigate another page in React Native on button click?

To redirect to another page on button click in React: Use the useNavigate() hook, e.g. const navigate = useNavigate(); . Call the navigate() function, passing it the path - navigate('/about') . The navigate() function lets us navigate programmatically.


1 Answers

I know it's an older question but what I use is:

navigation.pop(n);

Takes you to the previous screen in the stack. If you provide a number, n, it will specify how many screens to take you back within the stack. https://reactnavigation.org/docs/en/navigation-prop.html

like image 129
Vincent Avatar answered Oct 07 '22 00:10

Vincent