ReactNative使用iconfont图标

发表日期:2020年7月6日 15:02

ReactNative底部标签导航器字体图标

使用到的库:react-native-iconfont-cli

npm install react-native-svg
npm install react-native-iconfont-cli 

安装完毕后执行

npx iconfont-init

执行完毕后会在根目录下生成一个iconfont.json文件

{
    "symbol_url": "请参考README.md,复制官网提供的JS链接",
    "use_typescript": false,
    "save_dir": "./src/assets/iconfont",  //可以修改路径
    "trim_icon_prefix": "icon",  //图标名称前缀
    "default_icon_size": 18
}

执行命令生成文件

npx iconfont-rn

使用图标

<tab.Screen options={{ title: '职位', tabBarIcon: () => <IconFont name='iconworkexperience' color='#5dd5c8' size='25'></IconFont> }} name='Jobs' component={Jobs} />