react-native - 如何使用 DrawerNavigation 在 React Native 中实现注销

Question

我有一点问题。我正在尝试在 React 本机中从 Stacknavigator 实现注销。我在网上搜索过，但没有看到任何可以从中学习一两件事的好资源。

我的源代码App.js看起来有点像这样。

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;

请我想知道如何实现注销，我尝试过这样的事情

const LogoutNavigator = createStackNavigator({
            'Hotel Reservation':{screen: Login,
              navigationOptions: ({navigation}) => ({
                headerLeft: () => (
                  <TouchableOpacity
                  style={{marginLeft: 20}}
                  onPress={() => navigation.navigate('Login')}>
                  <Icon name="menu" size={12} /></TouchableOpacity>
                  )})
                },
              });

但这并不像我预期的那样工作。请协助。我对 React native 有点陌生。

标签： react-nativenavigation