引入 : import { Icon } from 'antd';

 <Icon
type = "home" //图标样式
theme = "filled"    //风格,实心,描线,双色等 (filled , outlined , twoTone)
spin            //是否旋转动画 ,bollean ,false默认
twoToneColor = "#333"   //双色图标设置,双色图标的主要颜色
/>

1.如何使用阿里巴巴图标

const IconFont = Icon.createFromIconfontCN({
scriptUrl: '//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js', //阿里巴巴图标引用地址
}); ReactDOM.render(
<div className="icons-list">
<IconFont type="icon-tuichu" />
<IconFont type="icon-facebook" />
<IconFont type="icon-twitter" />
</div>,
mountNode
);

antd Icon的更多相关文章

  1. Python flask+react+antd实现登陆demo

    这两天在研究flask和antd,想把这俩个东西结合来使用,单独学antd的时候用的是dva来配置,但是发现这样与flask结合的话需要启动两个服务,作为flask只是作为数据的接口,并没用用到其强大 ...

  2. 前端004/React常用UI组件

    每天进步一点点〜 Ant Design of React //蚂蚁金服设计平台.需要应用何种类型组件可参考API React + mobx + nornj 开发模式文件说明: [1].A.t.html ...

  3. 十九、React UI框架Antd(Ant Design)的使用——及react Antd的使用 button组件 Icon组件 Layout组件 DatePicker日期组件

    一.Antd(Ant Design)的使用:引入全部Css样式 1.1 antd官网: https://ant.design/docs/react/introduce-cn 1.2 React中使用A ...

  4. antd 离线 icon

    讲你下载下来的官方提供的字体库解压后所有文件复制到node-modules/antd/dist目录下 创建新的文件夹iconfont 在你项目生成的css入口文件对应的源码less文件开始添加如下两句 ...

  5. webpack+react+antd 单页面应用实例

    React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始 ...

  6. react引用antd的form表单

    引用form是第三方插件ant插件,官网网址:https://ant.design/.用到的antd的版本是@2.0.1.form(https://ant.design/components/form ...

  7. 使用antd UI 制作菜单

    antd 主页地址:https://ant.design/docs/react/introduce 在使用过程中,不能照搬antd的组件代码,因为有些并不合适.首先,菜单并没有做跳转功能,仅仅是菜单, ...

  8. webpack热更新问题和antd design字体图标库扩展

    标题也不知道怎么写好,真是尴尬.不过话说回来,距离上一次写文快两个月了,最近有点忙,一直在开发新项目, 今天刚刚闲下来,项目准备提测.借这个功夫写点东西,把新项目上学到的一些好的干活分享一下,以便之后 ...

  9. [React] react+redux+router+webpack+antd环境搭建一版

    好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...

随机推荐

  1. MySQL表级约束和列级约束

    对一个数据列建立的约束,称为列级约束 对多个数据列建立的约束,称为表级约束 列级约束即可以在列定义时生命,也可以在列定义后声明. 表级约束只能在列定义后声明. NOT NULL和DEFAULT只存在列 ...

  2. [目录]hybrid app 开发实战(基于ionic,cordova,angularjs)

    序:为什么要写这个系列 第一章:hybrid app开发之技术选型 第二章:ionic,cordova,phonegap关系浅析 第三章:ionic环境搭建之windows篇 第四章:ionic环境搭 ...

  3. emacs窗口半透明

    转自 http://blog.csdn.net/dsjlzh/article/details/7804733 ;; transform window;; Anchor: March Liu (刘鑫) ...

  4. JS中的instanceof和typeof

    原文链接:http://hi.baidu.com/pryzjvvpkkbhjyq/item/440fb91cda5cb90b8ebde43f typeof用以获取一个变量的类型 语法:typeof a ...

  5. C#使用System.xml.linq来生成XML文件

    直接看代码: /* * <?xml version="1.0" encoding="utf-8"?> * <Files Path=" ...

  6. 深入redis内部--内存管理

    1. Redis内存管理通过在zmalloc.h和zmalloc.c中重写c语言对内存的管理来完成的. redis内存管理 c内存管理 原型 作用 zmalloc malloc void *mallo ...

  7. iconfont_3种引用方式

    IconFont 图标的3种引用方式   新版Iconfont-阿里巴巴矢量图标库支持三种引用方式: 1.unicode引用(原始) unicode是字体在网页端最原始的应用方式,特点是: 兼容性最好 ...

  8. 告别Flash——那些年我们追过的FusionCharts

    随着FusionCharts最终放弃Flash这块蛋糕,不.或者已经不能叫做蛋糕了,现在Flash图表控件就只剩下AnyChart这一个独苗了,到底Flash还能走多远?这是Flash的末路吗? 众说 ...

  9. TortoiseGit记住用户名&密码

    配置并安装好git之后鼠标右键: 在全局配置文件末尾添加一行: [credential] helper = store *主意保存时以utf-8格式保存,否则中文可能会乱码,这样下次只需输入一次用户名 ...

  10. DataGridView初始化,加载数据

    1,创建winform窗体应用程序 2,在界面上拖入DataGridView控件 3,添加相应的列如图: 4,开始编写后面的代码: private DataTable CountryDt = new ...