标题不适用于react-navigation createStackNavigator

时间:2019-04-26 13:21:53

标签: react-native react-navigation react-navigation-stack

我在我的应用程序中createStackNavigatorcreateBottomTabNavigator中使用react-navigation。我想在屏幕上显示标题。在 React Navigation's tutorial之后,我是这样实现的:

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

但是,导航栏中什么也不显示。我也尝试过headerTitle,但无济于事。

我在做什么错了?

2 个答案:

答案 0 :(得分:4)

有两种设置navigationOptions,对象或函数的方法

对象

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

返回对象的函数

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

您的代码不起作用是由于您的箭头功能出错,您应该在主体周围添加一个括号,以便它返回对象。

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

答案 1 :(得分:1)

navigationOptions不应是函数,而应是JSON。因此,删除箭头并按以下步骤操作:

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