如何使用DrawerNavigator

Question

我正在使用React Native实现一个应用程序，我想使用react-navigation的DrawerNavigator。我想要的是这个：

这项实施效果很好：

import { DrawerNavigator } from "react-navigation";
import { HomeScreen, HttpScreen } from "./screens";

const App = DrawerNavigator({
  Home: StackNavigator({ screen: HomeScreen }),
  Http: StackNavigator({ screen: HttpScreen }),
});

export default App;

然而，该应用程序没有标题栏（工具栏）。使用StackNavigator，它就像传递这样的navigationOptions一样简单：

const App = StackNavigator({
  Home: { screen: HomeScreen },
  Http: { screen: HttpScreen }
}, {
    navigationOptions: {
      headerStyle: {
        backgroundColor: "white"
      }
    }
  });

为Android和iOS结束这个精美的原生标题：

所以我尝试过这样的DrawerNavigator，如下所示，但它没有做任何事情。

const App = DrawerNavigator({
  Home: { screen: HomeScreen },
  Http: { screen: HttpScreen },
}, {
    navigationOptions: {
      headerStyle: {
        backgroundColor: "white"
      }
    }
  });

有关如何在使用react-navigation here时配置标题栏的说明，但是文档始终引用StackNavigator，没有DrawerNavigator或TabNavigator，而且它是混乱。

在使用DrawerNavigator时如何配置标题栏的任何想法？

Answer 1

我遇到了同样的问题，并通过在我的视图中使用自定义标题解决了这个问题。