2

我将 React Navigation Drawer 与自定义内容组件一起使用。下面是我创建抽屉导航的代码：

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 以显示注销对话框

4

1 回答 1

-3

您可以使用简单的 toast，而不是使用对话框或警报框。使用react-native-toasty

并在注销时添加以下内容

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

注销后，您可以导航到所需的任何屏幕。

希望这可以帮助。

你可以走了！

于 2019-06-25T04:18:12.050 回答