时间戳

首页 > 解决方案 > console.error : "fontFamily "Material Icons" 不是系统字体，还没有通过 Font.loadAsync 加载

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

问题描述

我正在尝试从 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')})

有任何想法吗？

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

解决方案

当您使用 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"
/>

检查图标是否存在也是值得的，您可以在目录中执行此操作。

推荐阅读