安裝

參考Ionicons

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

這時(shí)候可能會(huì)報(bào)錯(cuò)：npm WARN deprcated lodash@4.2.0:This package is deprecated. Use Object.assign.

運(yùn)行命令行
npm i --save lodash.assign
In Node.js:

var assign = require('lodash.assign');   

npm install rnpm -g

rnpm link

使用

引入vector-icons:

var Icon = require('react-native-vector-icons/Ionicons');

修改組件值：eg.

Button -> Icon.Button
TabBarIOS.Item -> Icon.TabBarItem

修改屬性值：eg.

icon -> iconName
selectedIcon -> selectedIconName

坑

碰到過Ionians導(dǎo)入不成功，錯(cuò)誤提示信息為：

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. 

于是我將 var Icon = require('react-native-vector-icons/Ionicons');改為
import Icon from 'react-native-vector-icons/Ionicons';導(dǎo)入成功

總結(jié)

以上是生活随笔為你收集整理的Ionicons的使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。