Ionicons 未显示在 React Native 中

Question

我正在尝试使用 Ionicons 通过 Tab Navigator 添加图标。

我正在从 expo/vector-icons

导入它们

import { Ionicons } from '@expo/vector-icons';

然后我将我的屏幕添加到我的导航器

const TabNavigator = createBottomTabNavigator(
  {
    Home: {screen: HomeStack},
    AddNew: {screen: AddNewScreen},
    Settings: {screen: SettingsStack},
  },

并在导航选项中启动我的 Ionicons

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

  tabBarIcon: ({ focused, tintColor }) => {

    const { routeName } = navigation.state;
    var iconName;
    if (routeName === 'Home') {
      iconName = 'add-circle-outline';
    } else if (routeName === 'AddNew') {
      iconName = 'ios-add-circle';
    } else if (routeName === 'Settings') {
      iconName = 'md-options';
    }
    return <Ionicons name={iconName} size={25} color={tintColor} />;
  },  });

然后我设置我的 AppContainer 并导出它

const AppContainer = createAppContainer(TabNavigator);

export default AppContainer;

我尝试使用 MaterialIcons 而不是 Ionicons，结果相同。我的同行，他们已经成功实现了ionicons，不必使用AppContainer来导出他们的导航器，所以我倾向于认为这是问题所在。

已经用了一段时间了，但它对我不起作用。

Answer 1

错误是由于 expo/vector-icons 文件夹未声明。

我在终端中用这个命令解决了它：

npm install @expo/vector-icons

Answer 2

这可以通过在 app/build.gradle

中添加以下行来解决

   apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

这有助于我获取图标，请注意不要将其粘贴到 android/build。gradle。

Ionicons 未显示在 React Native 中

Ionicons not showing in react native

icons

native

navigator

reactjs

ionicons