I'm creating a react native app which has nested navigation and I'm trying to figure out exactly what replace is doing.
Inside my App.tsx,
<Stack.Navigator>
<Stack.Screen name='Request-Center' component={RequestCenter} />
<Stack.Screen name='Profile' component={Profile} />
<Stack.Navigator />
Inside Profile screen I have another stack navigator
<Stack.Navigator>
<Stack.Screen name='Profile-Landing' component={ProfileLanding} />
<Stack.Screen name='Deactivate-Account' component={DeactivateAccount} />
<Stack.Navigator />
And inside RequestCenter screen I have a stack navigator
<Stack.Navigator>
<Stack.Screen name='Request-Center-Landing' component={RequestCenterLanding} />
<Stack.Screen name='Request-Center-Status' component={RequestCenterStatus} />
<Stack.Navigator />
Now I navigate to ProfileLanding screen inside Profile screen and then to DeactivateAccount screen which also exists inside Profile screen
Now when I navigate from DeactivateAccount screen to RequestCenterLanding screen inside RequestCenter screen/stack I use replace because when I go back I want to land on the ProfileLanding screen and not DeactivateAccount screen
What happens is that on back I find myself landing on Home page and not the ProfileLanding page
Which means, I believe, that the entire Profile stack constituting of ( ProfileLanding => DeactivateAccount ) gets wiped and not just the latter screen.
I hope I didn't overcomplicate it. Can someone please explain to me why this is happening?