javascript - 如何从 React Native 中的 Reac Navigation 禁用 createDrawerNavigation 中的标头

Question

背景

在构建 React Native 应用程序并使用DrawerNavigator来自 React Navigation 的过程中，我最终需要自定义createDrawerNavigator. 我发现我可以自定义一个createStackNavigator。

创建堆栈导航器

1. 可以隐藏标题
2. 可以自定义标题。

createDrawerNavigator

1. 不能隐藏标题
2. 不能自定义标题。

问题

createDrawerNavigator使用from React Navigation时，如何隐藏或自定义自动添加到我的应用程序的标题？

例子

创建堆栈导航器

我可以隐藏这样使用时出现的标题createStackNavigator，

const Secure = createStackNavigator(
  {
    Drawer: {
      screen: drawer,
    },
  },
  {
    initialRouteName: 'Drawer',
    headerMode: 'none',
  },
);

createDrawerNavigator

当不使用createDrawerNavigator任何东西时，我会尝试隐藏或自定义标题。我还搜索了文档，但找不到任何关于如何处理 React Native 导航版本 3 中的标头的内容createDrawerNavigator。

标签： javascriptreact-nativereact-native-navigation

Answer 1

此代码将帮助自定义抽屉组件的标题无。

const customDrawerContentComponent = (props) => {
   Contact: { 
    screen: ContactScreen ,
    navigationOptions: () => ({
      header: null
    })
   }
}



const AppDrawerNavigator = createDrawerNavigator({
  Home: { 
    screen: HomeScreen,
    navigationOptions: () => ({
       header: null
    })
  }
}, {
  contentComponent: customDrawerContentComponent,
})