有没有一种方法可以显示图标，而不是React-Native MaterialBottomTabNavigator标签

Question

我的目标是在react-native中使用一些图标标签而不是文本标签来显示底部的导航栏。目前，我只能获取默认的文本标签。

在尝试添加图标之前，这是我的导航容器：

<NavigationContainer>
    <Tab.Navigator
      initialRouteName="Today"
      activeColor="white"
      inactiveColor="grey"
      barStyle={styles.tabBar}
      shifting={false}
      labeled={true}
    >
      <Tab.Screen
        name="Today"
        component={TodayScene}
        options={{
          tabBarLabel: 'Home',
          tabBarIcon: ({ color }) => (
            <MaterialCommunityIcons name="home" color={color} size={26} />
          ),
        }}
      />
      <Tab.Screen name="Schedule" component={ScheduleScene} />
    </Tab.Navigator>
  </NavigationContainer >

我可以访问“ MaterialCommunityIcons”，但我不知道如何显示它们。我已经为“今天”标签屏幕尝试了以下操作。这是我后来为了添加图标而写的内容：

    <Tab.Screen
        name="Today"
        component={TodayScene}
        options={{
          tabBarLabel: 'Home',
          tabBarIcon: ({ color }) => (
            <MaterialCommunityIcons name="home" color={color} size={26} />
          ),
        }}
      />

我在“选项”下添加的内容与react-navigation的官方网站上显示的格式几乎相同：

https://reactnavigation.org/docs/material-bottom-tab-navigator/#api-definition

但是，它将无法正常运行。我收到此错误：

“不变违规：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。”

那么，有谁知道我如何在react-native中将图标添加到底部材质的导航栏中？