React组件库Ant Design的安装与使用
一、什么是 Ant Design
1、Ant Design 提炼自企业级中后台产品的交互语言和视觉风格
2、Ant Design 使用 TypeScript 构建,提供完整的类型定义文件
二、Ant Design 的安装
1、在项目根目录终端引入:
npm install antd --save
2、在 index.js 中加入:
import 'antd/dist/antd.css';
三、Ant Design 的使用
这里引用 Ant Design 的 Spin 组件作为例子
(1)在页面的 script 中导入 Spin 组件
import { Spin } from 'antd';
(2)在 render() 中直接使用 <Spin />
render() {
return (
<React.Fragment>
<Spin />
</React.Fragment>
)
}
运行效果:

更多 MintUI 组件请参考 https://ant.design/docs/react/introduce-cn
React组件库Ant Design的安装与使用的更多相关文章
- React实战之Ant Design—Upload上传_附件上传
React实战之Ant Design—Upload上传_附件上传 Upload组件大家都在官方文档中看过了,但写的时候还是会遇到许多问题,一些新手看了文档后感觉无从下手,本文过多的简绍就不说了,直接看 ...
- 如何快速构建React组件库
前言 俗话说:"麻雀虽小,五脏俱全",搭建一个组件库,知之非难,行之不易,涉及到的技术方方面面,犹如海面风平浪静,实则暗礁险滩,处处惊险- 目前团队内已经有较为成熟的 Vue 技术 ...
- 七个不可错过的React组件库与开发框架
React是如今最火爆的前端技术,而React最棒的一个特点就是有大量功能丰富的组件库和开发框架可用.从按钮到卷轴到工具条,应有尽有,而且这些组件可以各行其是,也可以组装成复杂的UI,你也可以把UI分 ...
- React组件库集锦及学习视频
[转载]https://www.rails365.net/articles/react-zui-hao-de-ui-zu-jian-ku-ji-jin 这里有一篇讨论,说了哪个才是 React 最好的 ...
- react 编写 基于ant.design 页面的参考笔记
前言 因为我没有系统的学习 react,是边写边通过搜索引擎找相对的问题,看 ant.design的 中文文档 编写的一个单页面, 以下的笔记都是写 gksvideourlr 时记录的. 重新设定表单 ...
- React组件库
图表组件库:Recharts(React和D3构建的图表库) UI组件库:react-bootstrap
- React 组件库框架搭建
前言 公司业务积累了一定程度,需要搭建自己的组件库,有了组件库,整个团队开发效率会提高恨多. 做组件库需要提供开发调试环境,和组件文档的展示,调研了几个比较主流的方案,如下: docz 配置简单,功能 ...
- [翻译]怎么写一个React组件库(二)
本文同步发布于知乎专栏 https://zhuanlan.zhihu.com/p/27434018,喜欢本文的就去知乎点个赞支持下吧- 引言 该系列文章将通过创建一个组件库来引导你学习如何构建自己的组 ...
- [翻译]怎么写一个React组件库(一)
本文同步发布于知乎专栏 https://zhuanlan.zhihu.com/p/27401329,喜欢本文的就去知乎点个赞支持下吧- 引言 该系列文章将通过创建一个组件库来引导你学习如何构建自己的组 ...
随机推荐
- 如何立即回收内存C#
C#如何立即回收内存 1.把对象赋值为null 2.立即调用GC.Collect(); 注意:这个也只是强制垃圾回收器去回收,但具体什么时候执行不确定. 代码: [System.Runt ...
- springboot整合log4j2遇到的一个坑
背景 项目中使用springboot,需要用log4j2做日志框架 问题 项目启动报错:Could not initialize Log4J2 logging from classpath:log4j ...
- POJ 1221 UNIMODAL PALINDROMIC DECOMPOSITIONS
总时间限制: 1000ms 内存限制: 65536kB 描述 A sequence of positive integers is Palindromic if it reads the same f ...
- SpringBoot自动配置原理学习
介绍 构建Springboot项目时我们会创建一个启动类 @SpringBootApplication public class DemoApplication { public static voi ...
- day43——多表查询、Navicat工具的使用、pymysql模块
day43 多表查询 笛卡尔积--不经常用 将两表所有的数据一一对应,生成一张大表 select * from dep,emp; # 两个表拼一起 select * from dep,emp wher ...
- C++多态性----运算符重载与虚函数
一.多态性 ①概述:多态是指同样的消息被不同类型的对象接收时导致的不同行为. ②类型: 可以分为四类:重载多态.强制多态.包含多态.参数多态. ------------------------ --- ...
- Linux 下随机启动自己的应用 -请使用while(true) 不要Console.ReadKey()
Linux 下随机启动 自己的应用 -请使用while(true) 不要Console.ReadKey() 开机启动脚本启动,某些程序无法启动 原因 例如写了一个服务,不能停止程序运行,所以主线程成不 ...
- 按键消抖——task任务和仿真平台搭建
一.按键抖动原理 按键抖动原理:按键存在一个反作用弹簧,因此当按下或者松开时均会产生额外的物理抖动,物理抖动会产生电平的抖动. 消抖方法:一般情况下,抖动的总时间会持续20ms以内,按下按键后,等20 ...
- int and Integer
int和Integer的区别 1.Integer是int的包装类,int则是java的一种基本数据类型 2.Integer变量必须实例化后才能使用,而int变量不需要 3.Integer实际是对象的引 ...
- Centos 6.10 安装 Jenkins
前言 持续集成的概念 持续集成,Continuous integration ,简称CI. 持续集成正是针对这一类问题的一种软件开发实践.它倡导团队开发成员必须经常集成他们的工作,甚至每天都可能发生多 ...