react-native-vector-icons的使用 X图标

步骤一：

yarn add react-native-vector-icons
react-native link react-native-vector-icons

步骤二：

找到要引用图标于图标所在模块
图标库查询https://oblador.github.io/react-native-vector-icons/

image.png

步骤三：

引入需要的模块，比如

import AntDesign from 'react-native-vector-icons/AntDesign'
import Ionicons from 'react-native-vector-icons/Ionicons'
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'

//图标房子
<AntDesign name="home" size={13} color={#FF0000} />
//图标通知
<Ionicons name="ios-notifications-outline" size={13} color={#ff0000} />

步骤四

android/app/build.gradle文件，添加如下内容：（不添加这块内容会导致图标不能显示，显示X）

project.ext.vectoricons = [
    iconFontNames: [ 'MaterialIcons.ttf', 'EvilIcons.ttf' ]
]
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

这样就可以了

image.png