首页 > 解决方案 > react native navigation3 我想隐藏底部标签导航的一个标签

问题描述

在此处输入图像描述

我想隐藏图片中以黄色突出显示的标签。

怎么做?

我的代码:

const MainBottomTab = createBottomTabNavigator({
  HomeStack : {
    screen : HomeStack,
    navigationOptions : {
      showlabel:false,
      drawerLabel:NullComponent
    }
  } ,
  SettingsStack,
  },{
  tabBarPosition:"bottom",
  navigationOptions:{

  },
  tabBarOptions:{

activeTintColor: "green",
inactiveTintColor: "#00ccff",
style:{
  backgroundColor: "white"
},
indicatorStyle:{
  height: 0
},
showIcon:'true'


},
 swipeEnabled:true,
});

标签: reactjsreact-nativereact-navigation

解决方案


使用自定义 TabIcon

 navigationOptions :({ navigation }) {
  tabBarIcon: ({ tintColor }) => {

    const { routeName } = navigation.state;
    let iconName;
    if (routeName === 'Home') iconName = 'home';
    else if (routeName === 'Notifications') iconName = 'notifications';
    else if (routeName === 'Readout') iconName = 'readout';
    else if (routeName === 'Inbox') iconName = 'messages';
    else if (routeName === 'Profile') iconName = 'profile';
 //Tabicon is just custom Icon display widget . handle All tabicon in TabIcon by iconname 
     return <TabIcons iconName={iconName} tintColor={tintColor} />;

 }
}

推荐阅读