标题不适用于react-navigation createStackNavigator

Question

我在我的应用程序中使用来自createStackNavigator的createBottomTabNavigator中的react-navigation。我想在屏幕上有一个标题。在 React Navigation's tutorial之后我用这种方式实现了它：

createBottomTabNavigator(
    {
      Home: createStackNavigator(
       {screen: HomePage, navigationOptions: () => { title: 'Home'}}),
      ...
    },

但是，导航栏中不显示任何内容。我也试过headerTitle虽然无济于事。

我究竟做错了什么？

Answer 1

设置navigationOptions，对象或功能有两种方法

宾语

{
    screen: HomePage,
    navigationOptions: { title: 'Home' }
}

返回对象的函数

{
    screen: HomePage,
    navigationOptions: ({ navigation }) => {
       return { title: 'Home' }
    }
}

您的代码不起作用是由于您的箭头函数中有错误，您应该在主体周围添加一个括号，以便它返回对象。

{ screen: HomePage, navigationOptions: () => ({ title: 'Home'}) }

Answer 2

navigationOptions不应该是一个函数，而是一个JSON。所以，删除箭头，并执行以下操作：

createBottomTabNavigator(
{
  Home: createStackNavigator(
   {screen: HomePage, navigationOptions: { title: 'Home'},
  ...
},