console.error: "fontFamily "Material Icons"не является системным шрифтом и не был загружен через Font.loadAsync

Question

Я пытаюсь добавить иконку из Reaction-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')})

Есть идеи?

Answer 1

Поскольку вы используете 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"
/>

Также стоит проверить, что значок существует, вы можете сделать это в каталоге.