【React Native】react-native-vector-icons用法避坑

在用React Native开发App时，icon的使用必不可少。官网推荐使用react-native-vector-icons来完成icon的使用。
在学习的过程中碰到了一个问题：一步一步按照官网说明的步骤去使用icon，但是却无法显示。
通过不停的搜索，终于找到了解决方法。

环境：

React Native版本：0.70
@react-navigation/native：6.0.14

安装

npm install react-native-vector-icons

安卓平台设置

将 node-modeles\react-native-vector-icons\Fonts目录下的文件复制到项目andriod\app\src\main\assets\fonts 目录下，如果没有相应的文件夹的话，自己创建一个即可。

注意：无需修改build.gradle文件夹的配置

使用

其实我也是一步一步跟着官网来学习使用的，想知道更加多更加详细的代码请参见React Navigation官网

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

<Ionicons name='home' size={30} color="black"/>

react-native-vector-icons内有着许多的图标库，如AntDesign、FontAwesome、MaterialIcons、FontAwesome 5等等，用法都同上，只要注意更改相应的图标库名称即标签名即可。