如何让drawerOpen（）堆栈导航器屏幕选项答案

【问题标题】：how to get drawerOpen() to stack navigator screen Options如何让drawerOpen（）堆栈导航器屏幕选项
【发布时间】：2021-03-30 08:28:01
【问题描述】：

我有这个堆栈导航器：

const StackNavigator = () => (
<Stack.Navigator headerMode="screen" navigationOptions screenOptions={ss}>
    <Stack.Screen name="Main" component={MainScreen} headerMode="screen" />...............

我有屏幕选项的对象：

const ss = {
cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
gestureEnabled: true,
gestureDirection: "horizontal",
headerTitleAlign: "center",
headerHideShadow: true,
headerTintColor: "red",
headerStyle: {
    borderBottomWidth: 0.5,
    borderColor: "white",
    backgroundColor: "#1d2731",
},

headerTitleStyle: {
    color: "white",
},
headerLeft: () => <AnimateHamburger navigation={navigation} />,
};

当我进入组件 AnimatedHamburger 时不

我没有得到 openDrawer 的道具......我得到“...... navigation.openDrawer 没有功能............

AnimateHamburger 组件：

const AnimateHamburger = ({ navigation }) => {
console.log(navigation);
const isDrawerOpen = useIsDrawerOpen();

const toggleMenu = () => {
    navigation.openDrawer();
};

return (
    <View style={styles.icon}>
        <Icon
            style={styles.icon}
            onPress={toggleMenu}
            name={isDrawerOpen ? "enter" : "bars"}
            type={isDrawerOpen ? "antdesign" : "font-awesome"}
            color="black"
            size={30}
        />
    </View>
);
 };

请帮助我如何获得导航道具以从 AnimateHamburger 组件切换我的抽屉

【问题讨论】：

标签： react-native stack-navigator

【解决方案1】：

如果您收到openDrawer is not a function，那可能是您试图在不知道父抽屉导航器的嵌套导航器中访问此方法。您可以使用DrawerAction 从react-navigation 访问抽屉方法，看看这里：

https://reactnavigation.org/docs/drawer-actions

并像这样使用它：

https://reactnavigation.org/docs/nesting-navigators/#navigator-specific-methods-are-available-in-the-navigators-nested-inside

【讨论】：