一. 切換到工程目錄常潮,執(zhí)行
- 執(zhí)行安裝命令
npm install react-native-vector-icons --save
或者
yarn add react-native-vector-icons
注意:目前npm5存在安裝新庫時會刪除其他庫的問題保礼,可能后面會修復(fù)導(dǎo)致項(xiàng)目無法正常運(yùn)行镐依。請盡量使用yarn代替npm操作。
- 執(zhí)行以下命令鏈接原生庫
react-native link react-native-vector-icons
二. ios配置(ios需要單獨(dú)導(dǎo)入字體文件吁断,安卓link完就可以用了)
-
右鍵工程文件Add Files to "(你工程名)"
選擇node_modules/react-native-vector-icons/Fonts文件夾
三. 使用
- 如果用的是ionicons趁蕊,打開這個地址點(diǎn)擊相應(yīng)的圖標(biāo)復(fù)制名字http://ionicframework.com/docs/ionicons/
2.創(chuàng)建一個demo頁面,以下是使用demo
import React from 'react';
import Icon from 'react-native-vector-icons/Ionicons';
const Icon = () => {
return <Icon name="ios-add" size={30} color="red" />
};
完美收官仔役!
項(xiàng)目demo地址:https://github.com/duheng/Mozi
THE END掷伙!