用实例分析DevOps项目中动态表单的发展史

表单是前端开发常用的数据采集工具，随着技术发展，一个完善应用系统包含的功能越来越复杂，所需要的表单也越来越多。这些表单大同小异，使用的都是常用的输入框、下拉选择框等表单控件，各个表单之间的差异无非是使用控件的种类数目和与控件相对应的字段名称，对于表单的渲染和数据收集逻辑，都有极强的逻辑可以寻找，因此动态表单应运而生。

顾名思义，动态表单就是根据表单配置动态的渲染表单，实现需求，而不是一段段写死的大同小异的代码。动态表单的产生，大大的提升了开发效率，开发人员不用继续埋头在一堆单调的表单代码中和需求文件作斗争了。但是如何实现一个高效易用动态表单，也是一个不小的难题，今天就以普元技术中台DevOps的动态表单开发历程为例，为大家介绍DevOps项目中动态表单的发展史。

目录：

1．初版动态表单

2．问题和新需求

3．动态表单进阶

一、初版动态表单

最初的DevOps平台并没有关于动态表单的需求，在开发过程中，由于CICD部分种类纷繁的任务类型配置需要大量的表单与之一一对应，想要人工写完这些表单无疑要耗费很多的时间，所以我们开始了第一次的动态表单的实践。

此次动态表单实践由DevOps的CICD部分中的任务配置表单驱动，因此主要考虑的控件类型为输入框、下拉框、和代码编辑器。在实践中几个较为关键的地方分别为表单配置模型、表单联动、表单校验。

以上是较为基础的表单项的配置，我会选其中较为重要为大家说明：

attrDefId这是每一个表单项的唯一标识，前端主要用来为表单项设置ID便于获取对应元素进行其他操作；

attrId对应的是表单项对应值的字段名，即该向后端传递数据时所用的字段名，在一个完整的表单中，也是唯一的；

controlType写明了表单项类型，前端按照这项配置来决定展示的表单项是输入框、下拉框或其它指定的表单项类型；