I use React Navigation to do my Navigation in my mobile app and I have a structure navigation like this:
const AccountStack = createStackNavigator(
{
Account: AccountView,
...
},
{
initialRouteName: 'Account',
headerMode: 'screen',
....
}
)
const SearchUsersStack = createStackNavigator(
{
SearchUsers: SearchUsersView,
UserProfile: UserProfileView,
FriendsOfUser: FriendsOfUserView
},
{
...
}
)
const AccountModalStack = createStackNavigator(
{
AccountStack: AccountStack,
SearchUsersStack: SearchUsersStack,
},
{
initialRouteName: 'AccountStack',
headerMode: 'none',
mode: 'modal',
}
)
const MainApp = createBottomTabNavigator(
{
MainHome: HomeStack,
MainPlay: PlayStack,
MainAccount: AccountModalStack
},
{
...
}
)
If I'm in the "search User" stack (for example, in SearchUserView) and I click on the "Account" icon in the bottom tab navigator, the stack will dismiss correctly and I will return to my "account" view.
However, if I am in one of the routes of my AccountStack and I click on the "Account" icon in the bottom tab navigator, the stack does not dismiss. So if I'm very far in the account stack, I have to go back with the back arrow.
Why does it work when I'm in the SearchUserStack but not when I'm in my AccountStack ?
I hope to find help!
Thank you !
Viktor