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的更多相关文章

  1. React Native 中 CSS 的使用

    首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...

  2. iOS原生项目中集成React Native

    1.本文的前提条件是,电脑上已经安装了CocoaPods,React Native相关环境. 2.使用Xcode新建一个工程.EmbedRNMeituan [图1] 3.使用CocoaPods安装Re ...

  3. react native中的欢迎页(解决首加载白屏)

    参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...

  4. React Native中的网络请求fetch和简单封装

    React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...

  5. [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势

    http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...

  6. [转] 在React Native中使用ART

    http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...

  7. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

  8. react native中一次错误排查 Error:Error: Duplicate resources

    最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验. 今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate ...

  9. 在React Native中,使用fetch网络请求 实现get 和 post

    //在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...

  10. 《React Native 精解与实战》书籍连载「React Native 中的生命周期」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

随机推荐

  1. Yarn && npm设置镜像源

    安装yarn npm i -g yarn yarn yarn config set registry https://registry.npm.taobao.org --global yarn con ...

  2. 在计算机通信中,可靠交付应当由谁来负责?是网络还是端系统? 网络层协议 MAC帧、IP数据报、TCP报文 关系 IP地址与硬件地址 链路层与网络层

    小结: 1. 网络层两种服务 虚电路服务 virtual circuit  电信网 网络层负责可靠交付 数据报服务  网络层不负责可靠交付 提供灵活的.无连接的.尽最大努力交付的数据报服务 不提供服务 ...

  3. [archlinux][plasma][screensaver] plasma5配置屏保程序,没成功(-_-#)

    plamsa用了好久,一直没有屏保.我想要玄酷的屏保! 用xscreensaver, 之前用FVWM2的时候,就用过了,很玄酷. 一,安装 pacman -S xscreensaver 二,配置 xs ...

  4. 完美解决failed to open stream: HTTP request failed!(file_get_contents引起的)

    当使用php5自带的file_get_contents方法来获取远程文件的时候,有时候会出现file_get_contents(): failed to open stream: HTTP reque ...

  5. 内部排序->其它->地址排序(地址重排算法)

    文字描述 当每个记录所占空间较多,即每个记录存放的除关键字外的附加信息太大时,移动记录的时间耗费太大.此时,就可以像表插入排序.链式基数排序,以修改指针代替移动记录.但是有的排序方法,如快速排序和堆排 ...

  6. ORA-00054:resource busy and acquire with nowait specified解决方法

    1.用dba权限的用户查看数据库都有哪些锁 SELECT T2.USERNAME,T2.SID,T2.SERIAL#,T2.LOGON_TIME        FROM V$LOCKED_OBJECT ...

  7. ORACLE UNDO

    UNDO 数据操纵 数据操纵语言(DML)由以下SQL语句组成: INSERT,DELETE,UPDATE,MERGE DML始终作为事务处理的一部分执行,它可以: 使用Rollback命令执行回退 ...

  8. java ipv4校验正则字符串

    String IPV4_REGEX = "\\A(25[0-5]|2[0-4]\\d|[0-1]?\\d?\\d)(\\.(25[0-5]|2[0-4]\\d|[0-1]?\\d?\\d)) ...

  9. 添加linux系统调用的两种方式

    原文:https://blog.csdn.net/sdulibh/article/details/51889279 向linux内核添加系统调用,一是通过编译内核添加,二是通过内核模块的方式添加: 一 ...

  10. 【Python全栈-后端开发】Django入门基础

    Django基础知识 一. 什么是web框架? 框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构,使用框架可以帮你快速开发特定的系统,简单地说,就是你用别人搭建好的 ...