createBottomTabNavigator如何修改标题？

Question

我的代码

routers.js

import {createBottomTabNavigator} from 'react-navigation-tabs';

import home from '../views/home';
import my from '../views/my';

const RouteConfigs = {
  home: {
    screen: home, // This attribute works
    tabBarLabel: 'cc', // Why he didn't work
    showLabel: false, // Why he didn't work
  },
  my: {
    screen: my,
  },
};

const TabOptions = {
  swipeEnabled: true,
  animationEnabled: true,
};

const StackNavigator = createBottomTabNavigator(RouteConfigs, TabOptions);

export default StackNavigator;

import {createAppContainer} from 'react-navigation';

import routers from './routers';

export default createAppContainer(routers);

问题

预期： ['cc', 'my']

但实际结果： ['home', 'my']

screen: home, // This attribute works
tabBarLabel: 'cc', // Why he didn't work
showLabel: false, // Why he didn't work

文档：https://reactnavigation.org/docs/en/bottom-tab-navigator.html

Answer 1

你必须将它们传递为 navigationOptions :

  home: {
    screen: home, 
    navigationOptions: {
        tabBarLabel: "cc"
    }
  }

关于label部分，只能在bottomTabNavigator上全局更改：

const TabOptions = {
   swipeEnabled: true,
   animationEnabled: true,
   tabBarOptions: {
      showLabel : false
   }
};

如果你想将它隐藏在特定的标签中，你可以通过：

navigationOptions: {
    tabBarLabel: " "
}

createBottomTabNavigator如何修改标题？

How does createBottomTabNavigator modify the title?

react-native

react-native-android

react-navigation

我的代码

问题