在堆栈导航器屏幕内打开 React-Native 抽屉菜单

Zal*_*inh 3 navigation-drawer reactjs react-native stack-navigator

在我的应用程序中,我有 3 个堆栈,例如 StackOne

export const StackOne = createStackNavigator({
  OneScreen: { screen:one  },
  TwoScreen: { screen:two  },
  ThreeScreen: { screen:three  },
}, { initialRouteName: 'OneScreen', }
);
Run Code Online (Sandbox Code Playgroud)

堆栈二

export const StackTwo = createStackNavigator({
  OneScreenTwo: { screen:oneTwo  },
  TwoScreenTwo: { screen:twoTwo  },
  ThreeScreenTwo: { screen:threeTwo  },
}, { initialRouteName: 'OneScreenTwo', }
);
Run Code Online (Sandbox Code Playgroud)

我像这样使用抽屉导航。 主抽屉

const MainDrawer = createDrawerNavigator(
  {
    One: { screen: StackOne },
    Two: { screen: StackTwo },
    Other: { screen: OtherScreen},
  },
  {}
);
Run Code Online (Sandbox Code Playgroud)

一切正常。管理抽屉 - 堆叠得很好,唯一的问题是当我在StackOne's ScreenTwo左右滑动时仍然打开抽屉菜单。不仅这个屏幕在每一个屏幕打开抽屉菜单。

我尝试了几个链接,但找不到成功。希望有人帮助。我按照这个链接导航

谢谢

riw*_*iwu 5

您需要navigationOptions在 StackNavigator 而不是TwoScreenetc上指定,否则它将配置 StackNavigator 而不是 DrawerNavigator:

StackOne.navigationOptions = ({ navigation }) => ({
  drawerLockMode: navigation.state.index === 0 ? 'unlocked' : 'locked-closed',
}); 
Run Code Online (Sandbox Code Playgroud)

工作示例:https : //snack.expo.io/@riwu/stack-nav-lock-drawer