Search code examples
react-nativenavigationexposcreen

Forget Complete navigation history React Native


I am building a react native app that involves a payment process and on finishing the transaction a user is navigated to the homepage,the issues is the user can go back to the previous screen which is not what i want. I found out this solution that works halfway

navigation.replace("MainScreen");

since even though it replaces the previous screen it goes back to another previous screen. Is there a way I can forget the entire navigation after I finish my transaction

navigation Stack

<Stack.Navigator
  initialRouteName="Home"
  }}
>
  <Stack.Screen
    name="Home"
    component={Home}
  ></Stack.Screen>
  <Stack.Screen
    name="MainScreen"
    component={MainScreen}
  ></Stack.Screen>
  <Stack.Screen
    name="Cart"
    component={Cart}>
  </Stack.Screen>
  <Stack.Screen
    name="Orders"
    component={Orders}
  ></Stack.Screen>
  <Stack.Screen
    name="OrderDetails"
    component={OrderDetails}
  ></Stack.Screen>
  <Stack.Screen
    name="Checkout"
    component={Checkout}
  ></Stack.Screen>
</Stack.Navigator>

i am trying to navigate from checkout to mains screen


Solution

  • This worked for me. There is a popToTop method in naviagtion 6 that takes you to the first screen of your stack, if that is not the screen you want to be you then simply navigate to the page you want to be immediately. Like so,

        navigation.popToTop()
        navigation.navigate('MainScreen')