时间戳

首页 > 解决方案 > 禁用特定屏幕的抽屉

react-native - 禁用特定屏幕的抽屉

问题描述

我有如下实现抽屉导航器，我有如下堆栈导航器，

function MyStack() {
  return (
    <NavigationContainer>
      <Drawer.Navigator initialRouteName="Home" drawerStyle={{ width: (window.width) * 0.75 }} 
      drawerContent={(props) => <DrawerContent {...props} />}>
        <Drawer.Screen name="Home" children={createHomeStack} />
      </Drawer.Navigator>
    </NavigationContainer>
  );
}

我的堆栈导航器如下，

createHomeStack = () =>
  <Stack.Navigator screenOptions={{ headerShown: false }}>
    <Stack.Screen
      name="LandingPage" component={LandingPage}
    />
    <Stack.Screen
      name="LoginPage" component={LoginPage}
    />
    <Stack.Screen
      name="SignUpPage" component={SignUpPage}
    />
    <Stack.Screen
      name="DashboardPage" component={DashBoardPage}
    />
    <Stack.Screen
     name="OffersPage" component={OffersPage}
    />
    <Stack.Screen
     name="ProfilePage" component={ProfilePage}
    />
  </Stack.Navigator>

我想禁用 LandingPage、LoginPage、SignUpPage 的抽屉并仅启用其余屏幕的抽屉。谁能帮我存档这个目标？

标签： react-native

解决方案

您可以 通过检查您的路线页面将swipeEnabled=false添加到Drawer.Screen

<Drawer.Screen
  options={({ route, navigation }) => {
    return {
      swipeEnabled: false,
    };
  }}/>

推荐阅读