I have a bit of a Problem. I am trying to implement Logout from the Stacknavigator in React native. I have sought online and have not seen any good source to learn a thing or two from.
My source code for App.js is looking somewhat like this.
import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View , Image, TextInput, TouchableOpacity,Alert } from 'react-native';
import {createAppContainer, createSwitchNavigator} from 'react-navigation';
import {createStackNavigator} from 'react-navigation-stack';
import {createDrawerNavigator} from 'react-navigation-drawer';
import Icon from 'react-native-vector-icons/SimpleLineIcons';
import Splash from './src/Splash';
import Dashboard from './src/Dashboard';
import DubaiVisaRequest from './src/DubaiVisaRequest';
import HotelReserveRequest from './src/HotelReserveRequest';
import Login from './src/Login';
const DashboardNavigator = createStackNavigator({
'Dashboard':{screen: Dashboard,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} /></TouchableOpacity>
)})
},
});
const DubaiVisaReqNavigator = createStackNavigator({
'Dubai Visa Request':{screen: DubaiVisaRequest,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} /></TouchableOpacity>
)})
},
});
const HotelReqNavigator = createStackNavigator({
'Hotel Reservation':{screen: HotelReserveRequest,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.toggleDrawer()}>
<Icon name="menu" size={12} /></TouchableOpacity>
)})
},
});
const DrawerNavigator = createDrawerNavigator({
Dashboard:{
navigationOptions:{
drawerLabel: 'Dashboard',
},
screen: DashboardNavigator,
},
DubaiVisaRequest:{
navigationOptions:{
drawerLabel: 'Dubai Visas',
},
screen: DubaiVisaReqNavigator,
},
HotelReserveRequest:{
navigationOptions:{
drawerLabel: 'Request Hotel',
},
screen: HotelReqNavigator,
},
});
const AppSwitchNavigator = createSwitchNavigator({
'Splash' : {screen: Splash},
'Login' : {screen : Login},
'Drawer' : {screen: DrawerNavigator}
},
{
initialRouteName: 'Splash'
})
const App = createAppContainer(AppSwitchNavigator);
export default App;
Please I would like to know how I can implement Logout, I tried something like this
const LogoutNavigator = createStackNavigator({
'Hotel Reservation':{screen: Login,
navigationOptions: ({navigation}) => ({
headerLeft: () => (
<TouchableOpacity
style={{marginLeft: 20}}
onPress={() => navigation.navigate('Login')}>
<Icon name="menu" size={12} /></TouchableOpacity>
)})
},
});
But this does not work as I expect. Kindly Assist. I am a bit new to React native.