为什么图标没有显示在createMaterialTopTabNavigator中？

Question

enter image description here

const RootNavigation = createMaterialTopTabNavigator({

Page1: {screen: Page1,
  navigationOptions:{
    tabBarLabel:'Page4',
    tabBarIcon: () => (
      <Icon name="roket" color={tintColor} size={24}></Icon>

    )
}},

Answer 1

Ionicons软件包没有“ roket”图标。您输入的名称有误。

尝试一下：

<Icon name="rocket" color={tintColor} size={24}></Icon>

您可以在此处搜索图标：https://ionicons.com/

Answer 2

使用defaultNavigationOptions

，而不是尝试在navigationOptions中设置图标

const RootNavigation = createMaterialTopTabNavigator({
  Page1: {screen: Page1},
  Page2: {screen: Page2},
},
{
  defaultNavigationOptions: ({navigation}) => ({
    tabBarIcon: () => {
      const {routeName} = navigation.state;
      let iconName;
      if (routename === "Page1"){
        iconName = "ios-home";
      }
      else if (routename === "Page2"){
        iconName = "ios-add";
      }
      return <Icon name={iconName} size={24} color={tintColor} />
    },
    tabBarOptions: {
      activeTintColor: '#ff0000',
      inactiveTintColor: 'gray',
    }
  })
}