从左到右反应原生抽屉导航拖动抽屉不起作用

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了从左到右反应原生抽屉导航拖动抽屉不起作用相关的知识,希望对你有一定的参考价值。

我有抽屉导航的问题。我无法从左向右拖动抽屉,当我从按钮打开抽屉时,我无法按下抽屉外面以关闭它。

它适用于expo但不适用于react-native init

这是我想要实现的目标:

enter image description here

这是我的代码:

    const AppDrawerNavigator = createDrawerNavigator(
    {
        Home: {
            screen: Home,
            navigationOptions: {
                drawerLockMode: 'locked-closed',

                drawerIcon: (
                    <Image
                        style={{ width: 30, height: 30 }}
                        source={require('./assets/IconDrawerNavigation/home.png')}
                    />
                ),
            },
        },
        AboutUs: {
            screen: AboutUs,
            navigationOptions: {
                drawerIcon: (
                    <Image
                        style={{ width: 30, height: 30 }}
                        source={require('./assets/IconDrawerNavigation/about-us.png')}
                    />
                ),
            },
        },
        Logout: {
            screen: HomePage,
            navigationOptions: {
                drawerIcon: (
                    <Image
                        style={{ width: 30, height: 30 }}
                        source={require('./assets/IconDrawerNavigation/logout.png')}
                    />
                ),
            },
        },
    },
    {
        contentComponent: CustomDrawerComponent,
        contentOptions: {
            // activeBackgroundColor: 'red',

            labelStyle: {
                fontFamily: 'SomeFont',
                color: 'white',
            },
        },
    }
);
答案

确保正确安装和链接react-native-gesture-handler。你可以找到如何安装它here(还有一些关于android的步骤。确保你仔细做)。同样在navigationOptionsHomedrawerLockMode设置为locked-closed,这意味着你不能使用手势来打开或关闭抽屉。从this你应该把它设置为unlocked

以上是关于从左到右反应原生抽屉导航拖动抽屉不起作用的主要内容,如果未能解决你的问题,请参考以下文章

反应本机抽屉导航在按钮单击时不起作用

在Xamarin android中从右向左滑动抽屉

如何设置导航抽屉从右到左打开

如何使用反应原生导航 v2 添加侧边栏抽屉?

安装抽屉导航器时需要额外设置吗??? Reanimated2 警告。反应原生

Vuetify 导航抽屉拖动以调整大小