React组件库Ant Design的安装与使用

时间:2024-10-10 19:02:50

一、什么是 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>
)
}

运行效果:

React组件库Ant Design的安装与使用

更多 MintUI 组件请参考 https://ant.design/docs/react/introduce-cn