Ant Design 中文指南

Ant Design 是一个由蚂蚁金服开源的前端设计语言和 React UI 库，旨在快速搭建高质量的 React 应用程序。

快速开始

安装

首先，你需要确保你的项目中已经安装了 React 和 React DOM。

npm install react react-dom

然后，你可以通过 npm 或 yarn 安装 Ant Design：

npm install antd
# 或者
yarn add antd

引入

在你的 React 组件中，你可以通过以下方式引入 Ant Design：

import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css'; // 或者使用 less
import { Button } from 'antd';

ReactDOM.render(
  <Button type="primary">Hello, Ant Design!</Button>,
  document.getElementById('root')
);

主题定制

Ant Design 提供了强大的主题定制能力，你可以通过以下方式自定义主题：

import 'antd/dist/antd.css';
import { ConfigProvider } from 'antd';

ReactDOM.render(
  <ConfigProvider theme={yourTheme}>
    <Button type="primary">Hello, Ant Design!</Button>
  </ConfigProvider>,
  document.getElementById('root')
);

组件

Ant Design 提供了一系列丰富的组件，以下是一些常用的组件：

Button：按钮
Input：输入框
Table：表格
Form：表单
Modal：模态框
Alert：警告框

Button

Button 组件是最常用的组件之一，以下是一个简单的示例：

import React from 'react';
import { Button } from 'antd';

const App = () => (
  <Button type="primary">点击我</Button>
);

export default App;

更多组件的详细信息，请访问Ant Design 官方文档.

Ant Design 中文指南

快速开始

安装

引入

主题定制

组件

Button

资源