背景
在23年项目中流程很复杂，每一步表单需要灵活配置，于是就必须做表单设计器。
问题思考
1、理解组件渲染要环境区分设计环境、预览环境、生产环境
不同环境下，组件显示样子可能是不一样的。
生产环境肯定最正常的，必须按照我们想要的样子渲染
数据加载正常、属性渲染正常、数据联动也正常
预览环境次之，在表单设计器右上角点击预览时，弹窗出来的表单叫预览环境，预览环境组件和生产环境组件渲染出来是一样的，数据不会去请求，也没有关联
第一数据不会从数据源加载数据，因为有些数据源配置是需要前置输入参数的，比如从表格的行的操作编辑按钮，点编辑时需要从表格中至少获取到当前行数据id，编辑表单才能做后面请求数据或者保存数据，所以预览环境下是没有这个行id的，那么预览环境就不应该去执行初始化请求编辑表格的接口和保存接口
第二一些组件的数据源是接口请求，可能接口请求依赖于当前账号的角色，token或者其他各种表单所在环境的限制，这也是预览环境不同渲染的原因之一
第三表单中比如存在某些组件会联动显示隐藏时，比如前面一个下拉框选择不同值，后面的一个输入框可能隐藏或者显示，或者禁用，或者必填改非必填，等这些属性的动态更新，这在预览环境应该也是不起作用的，因为下拉框的值可能就是来只配置的数据，因为第一条数据源都不起左右，那么组件的属性联动应该也不起作用
第四表单中也不应该有表单验证，比如步骤条，如果设置下一步验证条件是上一步的表单都通过，那因为上一步都执行不全，如果验证不通过没法走下一步，那这样也不方便查看
设计环境最低，在表单设计器中间部分可拖拉拽区域就是设计环境
设计环境不仅有预览环境的这些限制，没有数据请求，没有属性联动，还可能渲染出来的组件和生产环境渲染出来的组件不同
解释一下原因
没有数据请求这点好理解，一是没有可能存在的前置输入，二是不具备当前账号角色等可能的身份信息
组件渲染效果和生产环境不一致这个不好理解，比如常见的比如输入框，在三种环境就应该是一样的，但是比如是步骤条组件，步骤条组件本身只包含上面的步骤，而不包含下面的每步表单内容，如果步骤条设计成原始的只有上面步骤，那在页面设计器中，就需要做多个区域分别关联每一步，会造成表单设计关联复杂，所有最好是用类似tab标签框的在设计器页面
2、组件定义
可以看上图，左边有几十种组件是内置的，可以从左边拖拽放到中间区域
第一要解决组件定义问题，组件定义就是组件用哪个代码渲染（要区分设计环境、预览环境、生产环境，这些后面要详细讲），组件有哪些属性，属性否默认值是什么，属性有哪些改变的范围（可选项有哪些、某些可能有最大最小阈值，属性有哪些联动，包括属性联动和事件联动，属性对应环境的渲染代码，这些后面要详细讲）
组件属性也是表单渲染
这个问题很哲理
页面拖拽
搜索页面拖拽实现，大多数都是使用 vuedraggable，看上图知道页面能拖拽的区域是左->中和中->中、中上->中下，左边组件会拖拽到中间区域，中间区域会移动组件
数据联动
以下拉框为例，下拉框数据项可以从接口中请求到，而且可以带参数，更可以根据表单其他组件值变化重新请求下拉框数据项（响应式）。
数据请求可以的参数有，表单数据，表格行数据，初始化数据，数据项数据，路由数据，当前用户数据，自定义数据
属性动态变化
以这个下拉框的是否显示为例，当然其他属性必填、禁用、验证、显示，这些都类似
除了明确的是、否选项外，还有动态的计算确定是否，上图表单数据，比如当某个组件值大于多少时，当前下拉框显示，或者是复杂的与或条件总共来判定，在PC上依靠eval来计算的，但是在小程序上要手动拆分与或来自己计算。总共可选条件类型有表单数据，表格行数据，初始化数据，路由数据，当前用户数据
数据转换
这一点是我现在想到的，数据转换对应可以类似表格行数据，在这一版本中我没有实现，在后面第二版中可以实现。
举个例子，在表格行中点编辑按钮，那么当前点击的表格行数据就应该带到对应编辑弹窗中备使用，如果是一棵树，编辑树的节点也会有各种按钮，树的节点弹出的弹窗对应的表格行数据也就是树的节点
目前第一版系统中，这个表格行数据是默认的，但是我认为这可以做一种数据转换，用于统一表格行，当前用户，初始化数据，路由数据，当前用户数据
可编程性
可编程性是一大亮点，因为我们知道，表单设计器做表单是很快，拖拉拽就生成，但是遇到不能满足的需求时怎么办？而且从实际经验来说，每个页面设计器配置的表单完全满足需求的情况很少，那么就必须保留可编程性的地方
我们梳理下，有哪些地方是需要编程的？编程的实现方式是什么？
第一个回答哪些地方是需要编程，我总结出5种类型
1、自定义钩子函数，这也是最广泛的，在数据请求前后常常需要做一些钩子事件，比如对接口参数额外重写，对返回数据重新处理，对接口请求成功后一些必要的额外接口或者提示
2、自定义事件，按钮的事件千奇百怪的，必须保留按钮的自定义事件
3、自定义表单验证条件，对于默认的验证条件来说肯定是不够，比如有些表单的字段需要通过接口判定是否重复，那么就需要在输入框失去焦点的时候请求接口判定验证
4、动态组件注册，对于表单设计器来说，我们提供的组件有几十种，有时就是会出现表单中某个组件没有，或者是业务很耦合的组件，那么就是需要编写代码动态组件进来渲染页面
5、最后一种是整个弹窗表单的完全自定义注册，我们可以配置一个表格，表格操作列配置一个操作按钮，操作按钮可以去关联一个我们配置的表单，这很理想。但是有时整个表单就是完全需要手动写代码做个弹窗，所以动态注册弹窗也是必要的。
我们回答了第一个问题，5类可以写代码。那第二个问题，怎么写代码呢，目前我项目中是写在前端项目代码中，现在我认为可以直接写在表单设计器中，做个在线代码编辑器来写，增加复用功能。
后记
还有其他问题，比如布局设计，样式设计，弹窗和页面等等。
