I'm using React-navigation V3. How can I navigate from MenuDrawer in contentComponent to a Login screen in the Swith Navigator??
This is my switch Navigator (my login).
const AppContainer = createAppContainer(createSwitchNavigator(
{
VerifyActiveUser,
ActProgramadas: MainDrawer,
Login,
SyncData
},
{
initialRouteName: 'VerifyActiveUser',
}
));
export default class StackNavigator extends Component{
render(){
return <AppContainer
/>;
}
}
This is my Drawer Stack (MainDrawer). MenuDrawer is my custom drawer, from there i want to go to Login Screen (From Switch Navigator) with a "go out" Button to end my user session but i don't know how to send navigations props to contentComponent of my drawer:
const DrawerConfig ={
drawerWidth: WIDTH * 0.86,
contentComponent: ({navigation}) => {
return (<MenuDrawer navigation = { navigation } />);
},
contentOptions: {
activeTintColor: 'blue',
activeBackgroundColor: 'green'
},
initialRouteName: 'ActProgramadas',
unmountInactiveRoutes: true,
edgeWidth: WIDTH * 0.80,
backBehavior: false
}
const MyDrawerNavigator = createDrawerNavigator({
ActProgramadas: { screen: StackNavigator },
ActRealizadas: { screen: StackActReal },
ObsTecnicas: { screen: StackObs },
ObsPendientes: { screen: StackObsPend },
ObsRealizadas: { screen: StackObsReal },
SyncData
}, DrawerConfig);
const AppContainer = createAppContainer(MyDrawerNavigator)
export default class DrawerNavigator extends Component{
render(){
return <AppContainer />;
}
}
Can I use redux to send the navigation.navigate('Login') prop from the swith to my custom drawer??
You can add a logout screen in your drawer. The screen is a React component which defines the logout behavior on mounting:
import React from 'react';
import { View, AsyncStorage, ActivityIndicator, StatusBar } from 'react-native';
export default class LogoutScreen extends React.Component {
async componentDidMount() {
await AsyncStorage.clear();
this.props.navigation.navigate('Login');
}
render() {
return (
<View>
<ActivityIndicator />
<StatusBar barStyle='default' />
</View>
);
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.