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

Question

我正在将 react-navigation 与我的 React Native 应用程序一起使用。我已经创建了一个底部选项卡导航器，并且想要使用屏幕上的内置标题。但标题没有显示。没有错误或警告。

app.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 成为 root 导航器，并使每个选项卡成为 StackNavigator，然后您将获得 header ，因为它是默认情况下为StackNavigator。