时间戳

首页 > 解决方案 > 在反应导航中更改父标题？

javascript - 在反应导航中更改父标题？

问题描述

我有一个stackNavigator，其中包括一些单个屏幕和底部导航内的底部导航我在底部的每个单个屏幕中都有一些我想要的其他屏幕更改父标题堆栈屏幕但它不起作用我不知道为什么？

这是我的代码

App.js ~ Parent 

const AppNavigator = createStackNavigator(
 {
    Register: {
      screen: Register,
      navigationOptions: () => ({
        drawerLockMode: 'locked-closed',
      }),
    },
    TabHome: {
      screen: TabHome, // bottom navigator
    },
},
{
    initialRouteName: 'TabHome',
    title: 'Audix', this title still in every other screens 
}
);


TabNavigation.js

const TabHome = createBottomTabNavigator({
    Home: {
      screen: Home,
      navigationOptions: {
        tabBarLabel: 'Home',
      },
    },
 Library: {
      screen: YourLibrary,
      navigationOptions: {
        tabBarLabel: 'library',
        // title: 'library', not work here !
        // headerStyle: {
        //   backgroundColor: '#00f',
        // },
      },
    },
});

标签： javascriptreact-nativereact-navigationreact-navigation-stack

解决方案

如果你喜欢这个解决方案，我认为你可以在每个屏幕上定义它。

class Library extends React.Component {
  static navigationOptions = {
    title: 'Home',
  };
  ...
}

如果您想为其他屏幕添加默认标题

const AppNavigator = createStackNavigator(
 ...,
 {
   defaultNavigationOptions: {
     title: 'DEFAULT_TITLE'
   }
 }
)

推荐阅读