Реагировать на собственный выход из системы в DrawerNavigator - PullRequest
Новая
       10

Реагировать на собственный выход из системы в DrawerNavigator

0 голосов
/ 18 апреля 2020

Я пытаюсь выполнить функцию выхода из системы в моем реактивном окне. Но я понятия не имею, как это сделать. Я сохранил токен в asyncstorage, мне нужно выйти из системы и очистить asyncstorage одновременно. Вот мой код, у кого-нибудь есть идеи по этому поводу? 

const Drawer = createDrawerNavigator();
const Stack = createStackNavigator();
export default class SideMenu extends Component   {

  render(){
    createHomeStack = () => 
    <Stack.Navigator>
      <Stack.Screen name="Upcoming Activities" component={HomeScreen} 
        options={{
        headerStyle: {backgroundColor: '#87CEFA',},
        headerTintColor: '#fff',
        headerTitleStyle: {fontWeight: 'bold',}
        }} />
      <Stack.Screen name="Details" component={DetailsScreen}
        options={{headerStyle: {backgroundColor: '#87CEFA',},
        headerTintColor: '#fff',
        headerTitleStyle: {fontWeight: 'bold',}
        }}/>
    </Stack.Navigator>

    createYourStack = () => 
    <Stack.Navigator>
      <Stack.Screen name="Your Activities" component={YourActivitiesScreen} 
        options={{
        headerStyle: {backgroundColor: '#87CEFA',},
        headerTintColor: '#fff',
        headerTitleStyle: {fontWeight: 'bold',}
        }} />
      <Stack.Screen name="Details" component={DetailsScreen}
        options={{headerStyle: {backgroundColor: '#87CEFA',},
        headerTintColor: '#fff',
        headerTitleStyle: {fontWeight: 'bold',}
        }}/>
    </Stack.Navigator>

    return (
      <NavigationContainer>
        <Drawer.Navigator initialRouteName="Home">
          <Drawer.Screen 
            name="Home"
            children={createHomeStack}
            options={{ drawerLabel: 'Home' }}
          />
          <Drawer.Screen
            name="Your Activities"
            children={createYourStack}
            options={{ drawerLabel: 'Your Activities' }}
          />
          <Drawer.Screen
            name="Logout"
            //component={}
            options={{ drawerLabel: 'Logout' }}
          />
        </Drawer.Navigator>
      </NavigationContainer>
    )

  }
}

Обновление вопроса: мне нужно перенаправить его к входу в систему, нажимая кнопку выхода в навигаторе ящика, но мой экран входа в систему использует Маршрутизатор из «реакции» -native-router-flux '

export default class Routes extends Component {
    render() {
        return(
            <Router>
                <Stack key="root" hideNavBar>
                    <Scene key="login" component={Login} title="Login" initial/>
                    <Scene key="signup" component={Signup} title="Signup" />
                    <Scene key="home" component={SideMenu} title="HomeScreen" />
                </Stack>
            </Router>
        );
    }
}

1 Ответ

1 голос
/ 18 апреля 2020

Вы можете сделать что-то подобное на экране выхода из системы: 

import React, { Component } from "react";
import { View } from "react-native";
import { AsyncStorage } from 'react-native';

class LogoutScreen extends Component{
    componentDidMount(){
        AsyncStorage.removeItem("yourKey");
        this.props.navigation.navigate('RouteName eg:Home');
    }
    render(){
        return(
         <View style={{alignItems:'center',justifyContent:'center',flex:1}}>
         </View>
        );
    }
}
export default LogoutScreen;

Надеюсь, это поможет!

...