pro-table:为快速开发带来增，删，改，查功能的简要列表页面

# @share/pro-table ## 功能简介  组件主要用于快速开发带有增、删、改、查功能的简要列表页面。 组件借鉴 antd ProComponent 系列 [ProTable](https://procomponents.ant.design/components/table) 的开发理念，基于表单组件和列表组件做了一层逻辑封装和组件扩展。 主要解决的问题： - 让表单、表格、标签三块内容的逻辑变成一个整体，使其三方的数据和视图表现始终保持一致，让开发者不再为其三者的关联逻辑所困惑，提高代码质量。 - 提供一系列预设行为和逻辑，简化表格和列表的写法，降低开发成本； ## 浏览器兼容性 IE9 及以上 ## 快速入门 ### 安装 ```sh $ yarn add @share/pro-table ``` **注意：组件的依赖采取对等依赖的形式，需要注意下以下版本号** 确保项目模块依赖满足以下版本 - `react`: `>=16.8.x` - `react-dom`: `>=16.8.x` - `react-router-dom`: `>=5.x.x` - `@share/form`: `>=2.x.x` - `@share/list`: `>=1.x.x` - `@share/shareui`: `>=2.27.x` - `@share/shareui-html`: `>=2.25.x` 如果版本不满足，需要各自装下最新版。 ### 基本使用 > 为了能更快速的开发，推荐使用编译器的代码模板，模板配置请看 [代码模板配置文档](./docs/code-template-config.md) ```jsx import React from 'react'; import { ProTable, usePT, Action, FakeRequest, Form, Input, FormItem, Table, Column } from '@share/pro-table'; // 伪造一个接口集合，传入源数据 const fake = new FakeRequest([ { name: '张三', age: '22' }, { name: '李四', age: '25' }, { name: '王五', age: '24' }, ]); const BaseUsage = () => { const pt = usePT({ initData: { name: '', age: '' }, dataSource: fake.findData }); return ( <ProTable {...pt}> <Form> <Input label="姓名" field="name" /> <FormItem> <Action.Query /> <Action.Reset /> </FormItem> </Form> <Table> <Column label="姓名" field="name" /> <Column label="年龄" field="age" /> </Table> </ProTable> ); }; ```  ## 更多示例 - 表格相关 - [增删改](./docs/demo#增删改) - [增删改-模态框](./docs/demo#增删改-模态框) - [排序控件实现](./docs/demo#排序控件实现) - [表格统计数据](./docs/demo#表格统计数据) - [批量导出](./docs/demo#批量导出) - 表单相关 - [常规使用](./docs/demo#常规使用) - [各个表单控件使用](./docs/demo#各个表单控件使用) - [自定义表单](./docs/demo#自定义表单) - [自定义查询方法](./docs/demo#自定义查询方法) ## 详细教程 - [开发流程说明](./docs/tutorial#开发流程说明) - [引入组件](./docs/tutorial#引入组件) - [获取组件数据](./docs/tutorial#获取组件数据) - [外层组件使用](./docs/tutorial#外层组件使用) - [表格使用](./docs/tutorial#表格使用) - [基础用法](./docs/tutorial#基础用法) - [带表头的用法](./docs/tutorial#带表头的用法) - [带初始查询条件](./docs/tutorial#带初始查询条件) - [兼容原生写法](./docs/tutorial#兼容原生写法) - [表单使用](./docs/tutorial#表单使用) - [基础用法](./docs/tutorial#基础用法) - [Form改版](./docs/tutorial#Form改版) - [自定义表单组件](./docs/tutorial#自定义表单组件) - [兼容原生写法](./docs/tutorial#兼容原生写法) - [标签使用](./docs/tutorial#标签使用) - [基础用法](./docs/tutorial#基础用法) - [兼容原生写法](./docs/tutorial#兼容原生写法) - [数据格式转化](./docs/tutorial#数据格式转化) - [mapField](./docs/tutorial#mapField) - [formDataToData和dataToFormData](./docs/tutorial#formDataToData和dataToFormData) - [clearEmptyField](./docs/tutorial#clearEmptyField) - [Action](./docs/tutorial#Action) - [页面跳转](./docs/tutorial#页面跳转) - [表格操作](./docs/tutorial#表格操作) - [模态框交互](./docs/tutorial#模态框交互) - [自定义元素](./docs/tutorial#自定义元素) - [预设行为](./docs/tutorial#预设行为) ## API - [ProTable](./docs/API#ProTable) - [Form相关](./docs/API#Form) - [Table相关](./docs/API#Table) - [Tabs](./docs/API#Tabs) - [Action](./docs/API#Action) - [usePT](./docs/API#usePT) - [usePTContext](./docs/API#usePTContext) - [clearEmptyField](./docs/API#clearEmptyField) - [useFormState](./docs/API#useFormState) - [message](./docs/API#message) - [FakeRequest](./docs/API#FakeRequest) ## 更新日志 请查看 [CHANGELOG.md](http://192.168.0.184:20000/biz-ued/component/pro-table/-/blob/master/CHANGELOG.md) ## 问题反馈 遇到问题或有任何建议请到 [GitLab](http://192.168.0.184:20000/biz-ued/component/pro-table/-/issues) 反馈。