一个屏幕上有多个堆栈导航器

Question

如何使用React Navigation 5在一个 Drawer.Screen 上显示多个 Stack.Navigators 。

假设我有两种产品：我的仪表板 Drawer.Screen 上的手机和平板电脑。手机和平板电脑代表一个单独的 Stack.Navigators ，如何将它们同时显示在同一屏幕上？

Answer 1

您可以这样：

export const DrawerNavigator = props => {
  return (
    <Drawer.Navigator
      drawerContent={props => <DrawerScreen {...props} />}
      initialRouteName={'HomeScreen'}
      drawerPosition={'right'}
      drawerStyle={{width: '100%', backgroundColor: 'transparent'}}
      screenOption={{backBehavior: 'order'}}>
      <Drawer.Screen
        name="App"
        component={isMobile ? MobileStackNavigator :     tabletStackNavigator}
        options={{gestureEnabled: false}}
      />
    </Drawer.Navigator>
  );
};