安装react-native-vector-icons并使用默认图标

1、 安装

使用npm安装react-native-vector-icons

npm install  react-native-vector-icons  --save

2、cocoapods安装

进入iOS目录执行 pod install 安装 RNVectorIcons

PS： 如果iOS项目编译爆红提示Multiple commands produce xxx.ttf之类的说明字体文件重复引用了，需要在target > Build phase > Copy Bundle Resource中删除重复引用的文件。xcode重复引用编译爆红处理参考。

3、文件检查

在node_modules文件夹下找到react-native-vector-icons文件夹，该文件夹下的Fonts文件夹中就是自带的默认的tff字体文件。

glyphmaps文件夹中的.json文件中可以查看每个图标对应的名字，

或者用icons图标对照库查找图标名字所对应的图标。

用xcode打开iOS项目，在target->info中查看字体文件是否被添加到Fonts provided by application的数组中，如果没添加的话图标会显示失败。

4、简单用法

首先引入

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

这个Ionicons对应的是Ionicons.json中的图标。

<Icon name={'ios-aperture'} size={25} color={'red'} />

效果如图

参考链接1
参考链接2
默认图标查找库