如何移除BottomTabNavigator中图标下方的底部文字？

你要实现的无文字标签效果如下：

针对主流的React Navigation @react-navigation/bottom-tabs库，有两种常用配置方式：

全局隐藏所有标签文字 #

在Tab.Navigator的screenOptions中配置tabBarLabel为false，一次性生效所有标签：

<Tab.Navigator
  screenOptions={{
    // 核心配置：隐藏标签文字
    tabBarLabel: false,
    // 其余原有配置保持不变
    tabBarActiveTintColor: 'tomato',
    tabBarInactiveTintColor: 'gray',
  }}
>
  {/* 各个Tab页面声明 */}
</Tab.Navigator>

单独隐藏指定标签文字 #

如果只需要隐藏部分标签的文字，在对应Tab.Screen的options中单独配置即可：

<Tab.Screen
  name="首页"
  component={HomePage}
  options={{
    tabBarLabel: false,
    // 其余原有配置如tabBarIcon等保持不变
  }}
/>

适配异常场景 #

如果以上配置不生效，通常是你自定义了tabBarLabel的渲染方法，直接将渲染返回值设为null即可：

tabBarLabel: () => null

注意：以上配置适配React Navigation 6.x及以上版本，低版本可尝试替换属性名为label即可生效

内容的提问来源于stack exchange，提问作者Sneh Parikh