从0到一实现一个动态表单之定义 JSON schema篇

首先介绍一下动态表单的概念：

动态表单是指----前后端约定一套表单定义规范。根据此规范，后端提供表单描述配置json schema；前端将此配置传入到动态表单框架后即可动态渲染出整个表单。整个过程，前端不需要写任何代码，均由框架完成（表单相关的交互、校验、数据等细节都在体现在表单描述配置json了，无需手动写入到业务代码中）

可能有人会质疑什么场景下会需要配置化表单。其实当你的业务量达到一定的量级，做很多流程审批任务协同之类的中后台产品的时候就会发现表单的需求真的是源源不断，大同小异，既浪费时间也浪费精力。 我们通过json schema规范每个UI组件。这个规范其实包括了中后台系统的UI规范，约束设计师的随意发挥，从而降低开发维护成本。ex：Ant Design 就是从UI规范约束设计师的随意发挥，从而打造出一整套的UI规范，然后衍生出一套后台组件体系。

动态表单的基石就是统一的UI体系。如果你的UI体系越随意，越个性，那么你的jsonSchema必然会越复杂越臃肿。所以我们需要和设计师&产品约定好合适的UI，从而实现一个合适的JSON-schema。 **

一个简单的动态表单架构图如下： 

• 本文会主要讲蓝色区域部分，

• 
  

下面我会详细介绍一下如何从零到一打造一套完整的动态表单解决方案。

如何定义一个合适的json-schema

json-schema文档见这里 在项目开发初期我们需要定义一个合适的json-schema，所谓合适的json-schema，就是指能满足现有的业务模型，尽量减少冗余的字段，又能支持一定的扩展。方便后续的维护更新扩展。 我们参考了集团的xform(外网可能无法访问。。。)

一个form表单由jsonSchema、uiSchema、formData、bizData四个json来描述 

• jsonSchema中描述了表单的数据类型、数据源、数据项等配置；

• uiSchema描述了表单字段的渲染方法、渲染参数等；

• formData描述了表单初始填充的各个字段的初始值；

• bizData中是对表单字段的业务属性（bizData不会影响Form的渲染）

下面分别说一下各个字段的描述含义

未完待续