1

我有一个 BottomTabNavigator ，其中包含另一个 BottomTabNavigator 和两个 DrawerNavigator 。

DrawerNavigators 之一表示经过身份验证的状态。我刚刚在此抽屉导航中实现了一个注销按钮。该按钮清除 redux 状态并导航到 BottomTabNavigator，更具体地说，导航到 Welcome 导航器的 Login 路由。

但是，一旦在注销后的 Welcome Navigato 中，当我尝试导航到 BottomTabNavigator 的另一条路线时，就会出现经过身份验证的 Drawer。

我不确定为什么会这样。当我刷新 expo 项目时，我意识到该应用程序确实处于未经身份验证的状态。

有没有办法确保在我注销时不会出现 Authenticated Drawer Navigator？

这是我的主要导航器：

import React, { Component } from 'react';
import {
  AppRegistry,
  View,
  SafeAreaView,
  Button,
  AsyncStorage,
  TouchableOpacity,
  Text,
} from 'react-native';
import { Ionicons } from '@expo/vector-icons';
import { PersistGate } from 'redux-persist/integration/react';
import {
  createBottomTabNavigator,
  createSwitchNavigator,
  createDrawerNavigator,
  createStackNavigator,
  DrawerItems,

 } from 'react-navigation';
import { Provider } from 'react-redux';
import Welcome from './screens/Welcome';
import Register from './screens/RegisterScreen';
import Login from './screens/LoginScreen';
import Home from './screens/Home';
import Events from './screens/Events';
import Board from './screens/Board';
import HomePage from './screens/HomePage';
import SettingsScreen from './screens/BusinessSettings';
import BusinessEvents from './screens/BusinessEvents';
import EventListings from './screens/EventListings';
import BusinessListings from './screens/BusinessListings';
import Business from './screens/Business';
import BusinessForm from './screens/BusinessForm';
import EventForm from './screens/EventForm';
import Logout from './screens/Logout';
import { persistor, store } from './store';


const MainNavigator = createBottomTabNavigator(
  {
    Welcome: createBottomTabNavigator({
      Welcome: Welcome,
      Login: Login,
      Register: Register,
      Board: Board,
    }),

    Home: createDrawerNavigator({
      Home: {
        screen: Home,
      },
      Events: {
        screen: Events,
      },
      Business: {
        screen: Business
      }
    }),
    HomePage: createDrawerNavigator({
      HomePage: {
        screen: HomePage,
      },
      Settings: {
        screen: SettingsScreen,
      },
      EventListings: {
        screen: EventListings
      },

      EventForm: {
        screen: EventForm
      },

      BusinessEvents: {
        screen: BusinessEvents
      },
      BusinessListings: {
        screen: BusinessListings
      },
      NewBusiness: {
        screen: BusinessForm
      },
      Business: {
        screen: Business
      }
    }, {

      contentComponent: (props) => (
        <View style={{ flex:1 }}>
         <SafeAreaView forceInset={{ top: 'always', horizontal: 'never' }}>
           <DrawerItems {...props} />
           <TouchableOpacity style={{  flexDirection: 'row', marginLeft: '8%', paddingTop: '2%' }} onPress={ async () => {
             await AsyncStorage.clear();
             await persistor.purge();
             props.navigation.navigate("Welcome");
           }}>
               <Ionicons name="ios-log-out-outline" size={24} color="#053541" /><Text style={{ marginLeft: '14%', fontWeight: 'bold', color: 'black' }}>Log Out</Text>
           </TouchableOpacity>
         </SafeAreaView>
   </View>
     ),
     drawerOpenRoute: 'DrawerOpen',
     drawerCloseRoute: 'DrawerClose',
     drawerToggleRoute: 'DrawerToggle'

    })
  },
  {
   headerMode: 'none',
   navigationOptions: {
        header: null,
        tabBarVisible: false,
        headerVisible: false,
        headerMode: 'none',
  },
    tabBarVisible: false,
    swipeEnabled: false,
    animationEnabled: false,
    lazy: true,
    transitionConfig: () => ({
      transitionSpec: {
        duration: 0,
      },
    }),

    /* Other configuration remains unchanged */
  }
);

export default class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
          <MainNavigator />
        </PersistGate>
      </Provider>
    );
  }
};
4

0 回答 0