React-navigation：使用底部选项卡导航器时不显示标题

Question

我正在使用react-navigation我的本机应用程序。我创建了一个底部选项卡导航器，并希望在我的屏幕上使用内置标题。但是标题没有出现。没有错误或警告。

应用程序.js：

const TabStack = createBottomTabNavigator({
  Upload: { 
    screen: upload,
    navigationOption: {
      headerTitle: "Upload"
    }
  },
  Profile: { 
    screen: profile,
    navigationOption: {
      headerTitle: "Profile"
    }
  }
});

const MainStack = createSwitchNavigator(
  {
    Home: { screen: TabStack }
  },
  {
    initialRouteName: 'Home'
  }
);

上传.js

class upload extends React.Component {
    static navigationOptions = {
        title: 'Upload'
    };

    constructor(props) {
        super(props);

    ...

我知道声明 navigationOptions可能不需要在组件中，因为它已经在 app.js 中声明了，但这只是为了表明这两种方法都不起作用。

我该如何解决？

Answer 1

TabNavigator不附带Header. 最常见的情况是使您TabNavigator的根导航器，并使每个选项卡成为StackNavigator您然后将获得标题，因为它是StackNavigator默认情况下的一部分。