I have a TabNavigator
inside a StackNavigator
(in the StackNavigator
I have the login
view and the TabNavigator
, which contains the other screens).
The problem is that I have to make something like a 'Logout
' button on a Tab that just redirect to the Login
view.
If I try to simply redirect to the LoginView
, the TabBar
still appearing on the bottom of the screen and that's not what I want.
Is there any way to click on the TabBar
button and return to the initial StackNavigator
? (Like an OnPress
property or something like that).
Here is my router
const tab_bar = TabNavigator({
Home: {
screen: HomeScreen
},
Logout: {
screen: LoginView // this just show the view but the tabBar still appearing
},
});
const Login = StackNavigator({
login: {
screen: LoginView,
},
List: {
screen: tab_bar
,navigationOptions: {header:null}
}
},
{
initialRouteName: 'login'
});
Done! Using the tabBarOnPress property and the Navigation Actions.
When the user clicks the
logout
button on the tabBar displays an Alert to confirm the action, then if the user accepts redirect to the login view.NOTE (22/09/2017): To use the tabBarOnPress property download the master branch version (not the version from NPM yet).