React Navigation Drawer contentComponent связывается с экраном

Question

Я использую React Navigation Drawer с компонентом пользовательского содержимого.Ниже приведен код для создания Drawer Navigation:

import { Dimensions } from 'react-native';
import { createDrawerNavigator, createAppContainer } from 'react-navigation';

import DrawerContent from '../components/drawer/DrawerContent'
import MainScreen from '../layout/MainScreen';

const MyDrawerNavigator = createDrawerNavigator({
    MainDrawer: {
        screen: MainScreen
    },
},
    {
        initialRouteName: 'MainDrawer',
        contentComponent: DrawerContent,
        drawerWidth: Dimensions.get('window').width / 1.5,
        drawerPosition: 'left',
        gesturesEnabled: false,
    }
);

export default createAppContainer(MyDrawerNavigator);

В DrawerContent я создал компонент, и в нем есть больше элементов.

export default class DrawerContent extends Component {

    onClickDrawerItems(type) {
        if (type == "Logout") {

            //I want to send a call back to MainScreen for showing a dialog           

        }
    }

    render() {
        return (
            <View style={Styles.drawerContainer}>
                {/* Header Drawer */}
                <ImageBackground
                    resizeMode='cover'
                    source={Assets.Image.im_logo_prasac}
                    style={Styles.headerDrawerImageBackground}>
                    <View style={Styles.headerBackgroundOverlay}>
                        ............
                    </View>
                </ImageBackground>

                <ItemsDrawer
                    icon={Assets.Icon.ic_logout}
                    title={Strings.DrawerItems.logout}
                    onClick={() => this.onClickDrawerItems("Logout")} />

            </View>
        );
    } 
}

Внутри функции onClickDrawerItems, как можноЯ отправляю обратный вызов в MianScreen для отображения диалога для выхода из системы

Answer 1

Вместо использования диалогового окна или окна предупреждения вы можете использовать простой тост. Используйте реакция-нативный-тосты

и при выходе добавить следующее

onLogout() {
    await AsyncStorage.clear();
    RNToasty.Error({ title: 'You have been logged out.' })
    //this.props.navigation.navigate('SplashScreen')
}

Вы можете перейти на любой экран после выхода из системы.

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

Ты в порядке!