a crud page by react and antd
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
config
docs
public
scripts
src
.gitignore
README-CLI.md
README.md
package.json

README.md

React-antd-CRUD

本项目是基于 react 和 antd 的 CRUD 应用。

开始

项目使用官方脚手架 create-react-app 搭建,相关指令同理。

说明

本项目详细说明参看博客

主要目录结构:

|-- api
|   |-- sqlData.js      # 操作 sqlData 的 ajax 方法
|-- components
|   |-- App.jsx         # 页面
|   |-- Content.jsx     # 页面主体内容区
|   |-- Factory.jsx     # 表单组件工厂
|   |-- FormModal.jsx   # 弹出的增加或编辑的表单组件
|   |-- Search.jsx      # 搜索组件
|-- libs
|   |-- ajax.js         # ajax 实例及公共方法
|   |-- util.js         # 工具方法
|-- store
|   |-- sqlConfig.js    # 数据库表单配置项
|-- index.js            # 入口文件
|-- style.css           # 样式文件

主要组件结构:

|-- App
|   |-- Menu                # 导航菜单
|   |-- Content             # 主要内容区
|       |-- Search          # 搜索组件
|           |-- Factory     # 表单工厂
|       |-- ButtonGroup     # 操作按钮群
|       |-- Table           # 表格组件
|           |-- Pagination  # 分页组件
|       |-- FormModal       # 弹出的编辑表单
|           |-- Factory     # 表单工厂

组件结构图解:

react-antd-crud