如何在本机反应中调用函数内部的抽屉导航器答案

【问题标题】：How to call drawer navigator inside function in react native如何在本机反应中调用函数内部的抽屉导航器
【发布时间】：2022-01-05 07:25:55
【问题描述】：

我是 React-native 的新手。所以我对导航了解不多。当我单击我的图像时，我需要打开我的抽屉侧菜单。我在函数内部调用了我的抽屉。

const Drawer = createDrawerNavigator();

function TopBar(props) {

    function sideMenuHandler() {
        return (
            <NavigationContainer>
                <Drawer.Navigator>
                    <Drawer.Screen name="SideBar" component={SideBar} />
                </Drawer.Navigator>
            </NavigationContainer>

        );
    }

    return (
        <>
            <View>
                    <TouchableWithoutFeedback onPress={sideMenuHandler}>
                        <Image source={require('../assets/profile.jpg')} onPress{sideMenuHandler}/>
                    </TouchableWithoutFeedback>

 
                </View>
            </View>

        </>
    );
}

【问题讨论】：

标签： reactjs react-native react-navigation navigation-drawer drawer

【解决方案1】：

首先，您必须按照docs 中的描述在应用程序的根目录中描述您的抽屉。

回答您的问题以编程方式打开、切换或关闭抽屉窗格，您可以使用DrawerActions 或下面描述的快捷方式。

导入 useNavigation 以访问导航道具。

import { useNavigation } from '@react-navigation/core';

通过调度来应用动作：

const navigation = useNavigation();

const handlePress = () => {
    navigation.toggleDrawer();
}

【讨论】：