console.error : "fontFamily "Material Icons" 不是系统字体，还没有通过 Font.loadAsync 加载答案

【问题标题】：console.error : "fontFamily "Material Icons" is not a system font and has not been loaded through Font.loadAsyncconsole.error : "fontFamily "Material Icons" 不是系统字体，还没有通过 Font.loadAsync 加载
【发布时间】：2019-03-06 19:30:16
【问题描述】：

我正在尝试从 react-native-vector-icons/MaterialIcons 添加一个图标：

import Icon from 'react-native-vector-icons/MaterialIcons';

<View style={styles.picture}>
  { <Icon
    name="add-circle"
    onPress={() => alert("Add Picture")}
    color="green"
  /> }
</View>

但我得到了：

console.error : "fontFamily "Material Icons" 不是系统字体并且尚未通过 Font.loadAsync 加载

我尝试使用 Font.loadAsync

await Font.loadAsync({'MaterialIcons': require('@expo/vector-icons/fonts/MaterialIcons.ttf')})

有什么想法吗？

【问题讨论】：

这是一个 Expo 应用程序吗？
是的，这是我在 vs code 上运行的 expo 应用
react-native-vector-icons 包含在 Expo 中。为什么要这样导入？您不需要这样做，您应该能够从 @expo/vector-icons 访问它们，而无需向您的 package.json 添加任何其他内容docs.expo.io/versions/latest/guides/icons
确实有效，谢谢！ :)

标签： react-native react-native-vector-icons vector-icons

【解决方案1】：

当您使用 Expo 时，最好使用内置的图标。

Expo 实际上带有react-native-vector-icons。所以你不需要安装任何东西。你可以从@expo/vector-icons导入图标

https://docs.expo.io/versions/latest/guides/icons/

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

<MaterialIcons
  name="add-circle"
  onPress={() => alert("Add Picture")}
  color="green"
/>

还值得检查该图标是否存在，您可以在directory 中执行此操作。

【讨论】：