没有从StackNavigator显示DrawerItem(反应导航)

时间:2017-05-19 07:44:30

标签: javascript react-native react-navigation

目前我正在尝试使用react-navigation制作抽屉。 我的react-navigation版本是:“^ 1.0.0-beta.7”

基本上我的反应导航结构看起来像这样

StackNavigator作为根.. DrawerNavigator作为第2层.. 和另一个StackNavigator作为第三层..

我的问题是,当我将我的组件放在DrawerNavigator中时,导航到组件后,组件标题将不会显示..所以,我希望有人能指出我当我将组件放入内部时如何使标题可见DrawerNavigator。如果我没有在DrawerNavigator中放置任何组件,并且内部StackNavigator中的所有屏幕都没有,那么标题将是可见的,但DrawerItems没有任何道具,因此没有显示在抽屉内。

const rootNav = StackNavigator({
  MainDrawerNavigator: { screen: MainDrawerNavigator }
}, {
  headerMode: 'screen',
  navigationOptions: { header: null }
})

const MainDrawerNavigator = DrawerNavigator({
  Home: { screen: HomeNavigator },
  Logout: { screen: Logout }
},{
  initialRouteName: 'Home',
  drawerWidth: 270,
  headerMode: 'screen',
  contentComponent: (props) => {
      return(
        <ScrollView>
          <DrawerItems {...props} />
        </ScrollView>
      )
  },
  contentOptions: {
    style: {
      marginTop: 0,
    }
  }
})

const HomeNavigator = StackNavigator({
    HomeMenu: { screen: HomeMenu },
    StartJourney: { screen : StartJourney },
    JournalList: { screen: JournalList },
)}

enter image description here

希望任何人都可以帮助我。 谢谢!

1 个答案:

答案 0 :(得分:0)

  

我试图实现DrawerOpen标题不会显示的地方

我不喜欢&#39;了解这是哪个标题?

  

但是当我从Drawer导航路线并打开一个屏幕时,那么   标题会显示

如果您正在谈论导航标题,它是HomeNavigator的标题,您可以像使用rootNav navigationOptions: { header: null }

那样做
 const HomeNavigator = StackNavigator({
    HomeMenu: { screen: HomeMenu },
    StartJourney: { screen : StartJourney },
    JournalList: { screen: JournalList },
},{
navigationOptions: { header: null }
})

当前的反应导航文档适用于beta.9 / beta.10我不知道这些道具是否适用于beta.7。从beta.7到beta.8的样式和道具有一些重大变化