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,喜欢本文的就去知乎点个赞支持下吧- 引言 该系列文章将通过创建一个组件库来引导你学习如何构建自己的组 ...
随机推荐
- sftp服务器的搭建
## 搭建前言: 主机系统:centos7 由于sftp基于ssh协议,所以我们无需安装多余的包,只需要进行相应的配置即可. ## 搭建过程: 1. 创建用户.用户组,设置目录权限等( ...
- LeetCode 205. 同构字符串(Isomorphic Strings)
205. 同构字符串 205. Isomorphic Strings
- git stash详解
应用场景: 1 当正在dev分支上开发某个项目,这时项目中出现一个bug,需要紧急修复,但是正在开发的内容只是完成一半,还不想提交,这时可以用git stash命令将修改的内容保存至堆栈区,然 ...
- 使用Kali MDK3无线攻击
mdk3 <接口> <测试_模块> [测试选项] 例:mdk3 --wlan0mon b (通过mdk3 使用网卡接口调用b类测试模块发起攻击)请注意该mdk3软件在使用时必须 ...
- jquery 根据后台传递过来的三维数组动态生成三级菜单
根据后台传递过来的三维数组动态生成三级菜单 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- ORACLE链接SQLSERVER数据库数据操作函数范例
ORACLE链接SQLSERVER数据库数据操作函数范例 create or replace function FUN_NAME(LS_DJBH IN varchar2 ,LS_ITM varchar ...
- THUPC&CTS&APIO2019:Far Away
流水账~ THUPC nmdwsmduliu! THUPC Day -INF~Day -2 大概就是自己做题和每周两次的考试,lsy和fcw两个外校的来吊打我们qwqqq THUPC Day -1 Z ...
- treeMultiselect 去掉勾选项
场景描述:弹窗,显示树形结构,节点层次可变(可只有一级节点,也可是多级节点),限制只能选择一个节点! 1.修改jquery.tree-multiselect.min.js 文件 2.前台页面 参考代码 ...
- .Net Core WebApi(1)— 入门
主要讲述利用EF Core的CodeFirst迁移数据库,简单接口增删改查的使用,利用Swagger生成接口文档. 1.新建项目 创建DbContext 和实体模型
- C# vb .net实现色调调整特效滤镜
在.net中,如何简单快捷地实现Photoshop滤镜组中的色调调整呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第一步 ...