双抽屉导航反应原生博览会答案

【问题标题】：Dual drawer navigation react native expo双抽屉导航反应原生博览会
【发布时间】：2018-11-19 10:03:59
【问题描述】：

我正在尝试为我的应用实现左抽屉和右抽屉。我无法在线找到任何可用的示例。我已经尝试了 3-4 个示例，包括来自 react native docs 本身的示例，我得到了undefined is a not an object (evaluating'Component.router)。如果有人有一个带有左右抽屉导航器的应用程序的工作示例，那就太好了。谢谢！

【问题讨论】：

标签： react-native react-navigation expo

【解决方案1】：

我相信你可以做这样的事情，创建一个新文件“AppNav.js”来处理你所有的导航/抽屉等~

AppNav.js

const LeftDrawer = createDrawerNavigator(
  {
    Screen1: {
      screen: Screen1,
    },
    Screen2: {
      screen: Screen2,
    },

  }, {
    headerMode: 'none',
    drawerWidth: SCREEN_WIDTH * 0.6,
    drawerPosition: 'left',
  })

const RightDrawer = createDrawerNavigator(
  {
    Screen1: {
      screen: Screen1,
    },
    Screen2: {
      screen: Screen2,
    },

  }, {
    headerMode: 'none',
    drawerWidth: SCREEN_WIDTH * 0.6,
    drawerPosition: 'right',
  })

const RootNavigator = createStackNavigator({
  LeftDrawer: { screen: LeftDrawer },
  RightDrawer: { screen: RightDrawer }
})

export default AppNav = props => {
  return <RootNavigator />
}

编辑：另外，在 RootNavigator 上，在调用 LeftDrawer 之前，您可以设置应用的主屏幕并将其设置为 'initialRouteName'

【讨论】：