react native 中使用react-native-vector-icons
1.引入依赖
cnpm install react-native-vector-icons --save
2.LINK原生
react-native link react-native-vector-icons
若成功的话会看到如下文件

3.在组件中引入
import Icon from 'react-native-vector-icons/Ionicons'; //引入图标
在reder中使用: <Icon name="rocket" size={30} color="#900" />
4.重新react-native run-android的时候会报错,因为node_module中的react-native-vector-icons下的 buildToolsVersion 和你项目的 buildToolsVersion 不一致,所以你需要修改react-native-vector-icons中的buildToolsVersion 和项目中的一致


注意:两者一定要一致,不一致一定会报错的
5.此时你可以重新run-Android一下,然后可以在模拟器上或者是真机上看到如下界面

至此,引入react-native-vector-icons及使用算是基本成功了
react native 中使用react-native-vector-icons的更多相关文章
- React Native 中 CSS 的使用
首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...
- iOS原生项目中集成React Native
1.本文的前提条件是,电脑上已经安装了CocoaPods,React Native相关环境. 2.使用Xcode新建一个工程.EmbedRNMeituan [图1] 3.使用CocoaPods安装Re ...
- react native中的欢迎页(解决首加载白屏)
参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...
- React Native中的网络请求fetch和简单封装
React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...
- [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势
http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...
- [转] 在React Native中使用ART
http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...
- react native中使用echarts
开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...
- react native中一次错误排查 Error:Error: Duplicate resources
最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验. 今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate ...
- 在React Native中,使用fetch网络请求 实现get 和 post
//在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...
- 《React Native 精解与实战》书籍连载「React Native 中的生命周期」
此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...
随机推荐
- [No0000166]CPU的组成结构及其原理
中央处理器(Central Processing Unit, CPU) CPU的基本架构和工作原理其实百科上讲得已经相当清楚了,不过我觉得有些事情呢还是给个例子出来比较方便学习.本文会先从内存地址,计 ...
- ==、===和Object.is()的区别
==.===和Object.is()的区别 一. 定义: ==:等同,比较运算符,两边值类型不同的时候,先进行类型转换,再比较: ===:恒等,严格比较运算符,不做类型转换,类型不同就是不等: Obj ...
- Instruments学习之Core Animation学习
当App发展到一定的规模,性能优化就成为必不可少的一点.但是很多人,又对性能优化很陌生,毕竟平常大多时间都在写业务逻辑,很少关注这个.最近在优化自己的项目,也收集了很多资料,这里先浅谈一下使用Inst ...
- 洛谷P4570 [BJWC2011]元素 线性基
正解:线性基+贪心 解题报告: 传送门! 这题其实没什么好写题解的,,,显然贪心一下尽量选魔力大的,不用证明趴挺显然的来着 所以就直接按魔力排个序,插入线性基里面,能插就加个贡献,over 放下代码趴 ...
- json和jsonp的区别?
json返回的是一串json格式数据:而jsonp返回的是脚本代码(包含一个函数调用): jsonp的全名叫做json with padding,就是把 json 对象用符合 js 语法的形式包裹起来 ...
- 对vue生命周期的理解
总共分为8个阶段,创建前/后,载入前/后,更新前/后,销毁前/后: 创建前/后:在beforeCreated阶段,vue实例的挂载元素$el和数据对象data都为undefined,还未初始化.在cr ...
- Vue项目
1.新建Vue项目:vue init webpack projectName 2.vue-router模块 1.安装vue-router模块:npm install vue-router --save ...
- 28-1-LTDC显示中英文
1.字符编码 由于计算机只能识别 0 和 1,文字也只能以 0 和 1 的形式在计算机里存储,所以我们需要对文字进行编码才能让计算机处理,编码的过程就是规定特定的 01 数字串表示特定的文字,最简单的 ...
- ReentrantLock可重入锁的原理及使用场景
摘要 从使用场景的角度出发来介绍对ReentrantLock的使用,相对来说容易理解一些. 场景1:如果已加锁,则不再重复加锁 a.忽略重复加锁.b.用在界面交互时点击执行较长时间请求操作时,防止多次 ...
- 第四节:Linux下如何解决冲突
当出现冲突,我们push的时候,会出现: 然后pull,下拉到本地: 查看冲突: 然后进入冲突文件: 修改为: 保存退出. 提交: