ProComponents 的理念

Ant Design 定义了基础的设计规范，对应也提供了大量的基础组件。可是对于中后台类应用，咱们但愿提供更高程度的抽象，提供更上层的设计规范，而且对应提供相应的组件使得开发者能够快速搭建出高质量的页面。

在 ProComponents 中咱们内置了一系列的设计规范，预设了经常使用的逻辑。在这个基础上咱们一样提供了灵活的支持，好比对于 ProTable 来讲你也能够把它彻底当作 Ant Design 的 Table 来用，对于 ProForm 来讲你也能够直接使用 Ant Design 的基础组件或者你的自定义组件。咱们但愿经过 Pro 系列组件提供快速高效你们高质量中后台应用的能力，进一步扩展 Ant Design 的能力，欢迎使用并提出宝贵的意见。

设计思路

对于几乎全部的业务来讲，咱们作的其实就是根据一个状态定义一系列的行为，以上面的 table 为例，首先咱们须要一个状态 dataSource 用于存储从服务器请求的数据，为了优化体验，咱们还须要一个 loading。因而咱们就有了一系列的行为，咱们须要先设置 loading=true，而后发起网络请求，网络请求完成以后就 设置 dataSource 为请求回来的数据，loading=false，一个网络请求就完成了，虽然很是简单，可是一个业务系统有至关多的表格，每一个表格都定义这么一次，这个工做量就很是大了。

若是要从新请求网络，咱们就须要封装一下行为，将以上的行为封装成一个方法，点击一下从新加载数据，若是你有分页，那么就须要新的变量 page，咱们在从新请求以前须要去根据须要来判断一下是否将页面重置为第一页，这又引入了一个变量。若是你的表格还要控制每页的数量，那么将会更加繁杂。这种重复性的劳动会浪费掉咱们的不少时间。

一个状态加一系列行为

以上的逻辑几乎存在于全部中后台开发中，每增长一个状态咱们就须要一系列的行为来进行管理，每一个行为若是耦合了太多的状态也会复杂到无以复加。

碰上这种状况，几乎全部程序员都会想办法进行分层，基于一样的思路，ProTable 但愿抽象出一层来解决掉复杂状态的问题，table 中最经常使用的状态就是 loading 和 dataSource，包括扩展的 page,pageSize 其实都是服务于网络状态，因而 table 抽象出了一个 request 的 api，在其中封装了 loading 和 dataSource 状态以及他们全部的行为，上一页，下一页，从新刷新，修改每页大小等行为。

这种封装模式可让前端从各类状态管理中脱身出来，专一于业务开发，也不须要 dva，redux 等数据流的方案，更加符合直觉。开发者只须要定义一个状态，重型组件会自动生成一系列行为。

为了渐进式使用咱们也提供了与 Ant Design 相同的 api，彻底能够降级成为一个 Ant Design 的 table 使用。

一个组件 ≈ 一个页面

重型组件区别于传统组件有个很大的不一样，重型组件在抽象时是将其当成一个页面来进行处理，因此 ProTable 会支持网络请求和自动生成查询表单，而 ProLayout 会支持自动生成菜单，二者都基于一样的思想也就是提供页面级别的抽象。

一个列表页应该能够用 ProLayout + ProTable 完成，一个编辑页应该使用 ProLayout + ProForm 完成，详情页能够用 ProLayout + ProDescriptions 完成。 一个页面在开发工程中只须要关注几个重型组件，下降心智负担，专一于更核心的业务逻辑。

设计与样式

在实际开发中咱们也常常会碰到一些设计问题，好比经典的按钮应该放在左面仍是右面，查询表单怎么布局，日期怎么格式化，数字的对齐问题，在重型组件中都进行了抽象。对于各类行为与样式咱们都通过了设计师的讨论与设计，默认好看而且好用。

感受很棒？当即使用

参与贡献

咱们很是欢迎你的贡献，你能够经过如下方式和咱们一块儿共建 🐲 ：

• 在你的公司或我的项目中使用 Ant Design Pro，umi 和 ProComponents。
• 经过 Issue 报告 bug 或进行咨询。
• 提交 Pull Request 改进 ProComponents 的代码。