[RN] React Native 使用精美图标库react-native-vector-icons
React Native 使用精美图标库react-native-vector-icons
一、安装依赖
npm install --save react-native-vector-icons // 下载库
react-native link react-native-vector-icons // 自动关联
二、使用
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import FontAwesome from 'react-native-vector-icons/FontAwesome'; <FontAwesome name={'wpforms'} size={} color={tintColor} /> <MaterialCommunityIcons name={'face'} size={} color={tintColor} />
使用说明:
react-native-vector-icons 的图标分为几个模块, 使用的时候先import FontAwesome from 'react-native-vector-icons/FontAwesome';
这样才能使用 FontAwesome 标签, 标签内使用 name 字段指定是某个图标.
使用的时候可以使用这个网站找到所有图标的索引:
https://oblador.github.io/react-native-vector-icons/
本博客地址: wukong1688
本文原文地址:https://www.cnblogs.com/wukong1688/p/10860490.html
转载请著名出处!谢谢~~
[RN] React Native 使用精美图标库react-native-vector-icons的更多相关文章
- [RN] React Native 使用 阿里巴巴 矢量图标库 iconfont
React Native 使用 阿里巴巴 矢量图标库 iconfont 文接上文: React Native 使用精美图标库react-native-vector-icons 本文主要讲述 如何 使用 ...
- [RN] React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题
React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题 解决方法: 添加 size, line-height ,值为和 height 一样的高度. 例如: ...
- 【RN - 基础】之Windows下搭建React Native开发环境
前言 React Native由Facebook公司于2015年F8大会上开源,其主张“Learn once, write everywhere”.React Native的核心设计理念是:既拥有Na ...
- React Native是一套使用 React 构建 Native app 的编程框架
React Native是一套使用 React 构建 Native app 的编程框架 React Native at first sight what is React Native? 跟据官方的描 ...
- 【学而思】利用shouldComponentUpdate钩子函数优化react性能以及引入immutable库的必要性
凡是参阅过react官方英文文档的童鞋大体上都能知道对于一个组件来说,其state的改变(调用this.setState()方法)以及从父组件接受的props发生变化时,会导致组件重渲染,正所谓&qu ...
- 【react】利用prop-types第三方库对组件的props中的变量进行类型检测
1.引言--JavaScript就是一个熊孩子 1.1对于JSer们来说,js是自由的,但同时又有许多让人烦恼的地方.javascript很多时候就是这么一个熊孩子,他很多时候并不会像C和java ...
- 【react】利用shouldComponentUpdate钩子函数优化react性能以及引入immutable库的必要性
凡是参阅过react官方英文文档的童鞋大体上都能知道对于一个组件来说,其state的改变(调用this.setState()方法)以及从父组件接受的props发生变化时,会导致组件重渲染,正所谓&qu ...
- JavaScript库 — — React
React不支持IE6.IE7 React是什么?用于构建用户界面的JAVASCRIPT库,是MVC中的V(视图). React特点:1. 声明式设计2. 减少与DOM的交互,高效3. JSX - J ...
- React学习笔记-1-什么是react,react环境搭建以及第一个react实例
什么是react?react的官方网站:https://facebook.github.io/react/下图这个就是就是react的标志,非常巧合的是他和我们的github的编辑器Atom非常相似. ...
随机推荐
- golang---命令源码文件与命令行参数
命令源码文件是程序的运行入口,是每个可独立运行的程序必须拥有的. import "flag" flag包实现了命令行参数的解析.每个参数认为一条记录,根据实际进行定义,到一个se ...
- 封装:WPF中可以绑定的BindPassWord控件
原文:封装:WPF中可以绑定的BindPassWord控件 一.目的:本身自带的PassWord不支持绑定 二.Xaml部分 <UserControl x:Class="HeBianG ...
- php 无限极分类,根据父级 找子级
/** * @param $data 数据(二维数组格式) * @param $adminId 管理员ID * @param $pid 权限的上级ID * @param int $level 水平变量 ...
- 三分钟掌握,使用Quqrtz.Net实现定时发送邮件
在实际的项目中,常遇到延时触发工作以及定时触发工作 这里所讲的是借助第三方的组件 Quartz.Net 来实现(源码位置:https://github.com/quartznet/quartznet) ...
- php 安装imap报错“configure: error: utf8_mime2text() has new signature”解决
环境:php官方docker镜像 php:7.2-apache 安装IMAP扩展模块执行命令:docker-php-ext-install imap 报错信息:configure: error: ut ...
- scp 基本用法(提高scp传输速度)
Outline spc 可以帮你实现: Linux Server 之间互传数据: Linux Server 和 Windows Server 之间互传数据: 参考: https://www.cnblo ...
- CodeForces 955D Scissors
昨晚CF比赛比较颓,今天有心情写题解就不错了QWQ 洛谷题目页面传送门 & CodeForces题目页面传送门 给定字符串\(a,b,|a|=n,|b|=m\),求是否可以在\(a\)中选\( ...
- vue组件4 利用slot将内容传递给组件
除了将数据作为prop传入到组件中,vue也允许传入HTML 父组件中的子组件:<custom-button>点我<custom-button/> custom-button子 ...
- 原油PETROLAEUM英语PETROLAEUM石油
petrolaeum (uncountable) Archaic spelling of petroleum petroleum See also: Petroleum Contents [hide] ...
- Centos7 rsync+inotify实现实时同步更新
inotify slave部署 把master上指定文件下载到本地的主机指定目录 yum install rsync –y [root@localhost ~]# useradd rsync ...