react native 使用阿里字体图标库
前言
本文基于 “react-native”: “0.69.5” 版本。
1.下载iconfont图标文件
将iconfont图标文件放置在src/assets/fonts
- react native 所需的字体图标文件仅需iconfont.ttf这一个文件即可
- 其余文件只是用于打开demo_index.html，打包时可将其余文件删除
2.链接字体图标文件到android/ios文件夹下
注：手动链接(react-native link)已从 react-native 0.69 中删除，以支持自动链接功能，需使用另外一个插件react-native-asset
yarn add react-native-asset --save
根目录新建 react-native.config.js
- assets 对应的是存放字体图标文件的路径
module.exports = {
assets: ['./src/assets/fonts/']
};
执行链接
yarn react-native-asset
3.使用字体图标
- fontFamily: ‘iconfont’(必须)
- {‘\ue835’} 其中e835为 iconfont 的 Unicode 的后四位
4.效果图
如果本篇文章对你有帮助的话，很高兴能够帮助上你。
当然，如果你觉得文章有什么让你觉得不合理、或者有更简单的实现方法又或者有理解不来的地方，希望你在看到之后能够在评论里指出来，我会在看到之后尽快的回复你。