react-native - 如何在某些路由上设置 headerMode 而不是其他路由。 ( react 导航)

Question

与 React Navigation是否可以使用 headerMode 定义某些路由而其他路由则没有？

我的大部分页面不使用标题，我找到了如何全局关闭它。

export const App = StackNavigator({
  PhotoView: {
    screen: Photos
  },
  ListView: {
    screen: List
  }
}, {
  headerMode: 'none'
});

但是如果我想在 ListView 上显示标题例如，我该怎么做？

我已经尝试了文档中的几种方法，但没有运气。

Answer 1

您可以将应用程序导航器包装在根导航器中，设置 navigationOptions.header至 null隐藏所有包装的导航器标题，然后设置 navigationOptions.headerTitle在要显示标题的屏幕上。

此答案基于 react-navigation 版本 v1.0.0-beta.9

const App = StackNavigator({
  PhotoView: {
    screen: Photos,
  },
  ListView: {
    screen: List,
    navigationOptions: {
      headerTitle: 'ListView',
    },
  }
});

export const Root = StackNavigator({
  Root: { 
    screen: App,
    navigationOptions: {
      header: null,
    },
  },
});