新人第013天---antd

目前在使用antd做一个页面,简单总结一下。

一、安装

1、在开始之前,先下载Node.js v4.x 或以上。

2、安装后输入npm install antd-init -g 安装antd https://ant.design/docs/react/introduce-cn

npm install antd --save

3、使用命令行进行初始化。

$ mkdir antd-demo && cd antd-demo

$ antd-init

antd-init 会自动安装 npm 依赖,若有问题则可自行安装。

二、运行

###一定要引入antd的css,否则样式不生效!!!!

最好的学习材料是官方文档,里面提供了许多组件和API,最近项目用到的几个,在下面简单说一下:

1. Tag

需求:在项目中展示当前机器的运行状态

写法:

新人第013天---antd_第1张图片
系统自动为标签元素添加的类

具体用法:

新人第013天---antd_第2张图片
判断不同状态码下tag的颜色


在表格中运用tag color

目前为止没有什么坑。。

2. Table

3. Tooltip

你可能感兴趣的:(新人第013天---antd)