自定义表单封装下拉组件间的级联属性、文本组件根据输入内容的灵活展示属性、文本组件之间的内容拼接属性、按钮的弹窗属性等。提供组件、表单之间的协同能力。
设计表单时点击右侧的事件属性,再点击添加事件,弹出选择添加事件的弹出框,点击事件类型的下拉框选择框可以选择事件类型。
image.png

1.级联

目前级联选项只支持单行文本以及下拉选择
(1)添加两个下拉组件,设置其标题分别为省和市。
image.png
(2)在右侧的组件属性中设置两个组件的选项。
image.pngimage.png
(3)添加事件属性,事件类型为级联。
(4)设置目标组件为市,当前组件选中安徽省时,让目标组件也就是市的选项为合肥、芜湖。当前组件选中江苏省时,让目标组件也就是市的选项为南京、扬州。点击确定完成设置。image.png
(5)点击预览图标,切换到预览模式即可查看效果。image.png
(6)当选中为安徽省时,市的选项为合肥、芜湖。当选中为江苏省时,市的选项为南京、扬州。image.png

2.拼接

目前展示选项只支持单行文本、下拉选择、密码、多行文本。
(1)添加三个单行文本组件,并设置为省、市、地址。image.png
(2)添加事件属性,事件类型为拼接。
(3)选中单行文本——省,输入“省”连接符并选中,选中单行文本——市,输入“市”连接符并选中,点击确认。
image.png
(4)点击预览图标,切换到预览模式即可查看效果。在省中输入安徽,在市中输入合肥,则自动拼接成安徽省合肥市显示在地址中。image.png

3.数据处理

  1. 目前展示选项只支持单行文本、下拉选择、密码、多行文本以及日期选择。<br />(1)添加三个单行文本组件。 ![image.png](https://cdn.nlark.com/yuque/0/2021/png/12997138/1637994786365-5b694e7f-0035-4c6f-bffc-a6d4a0d055e0.png#clientId=u3c70aaf5-2324-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=53&id=u64c06a5a&margin=%5Bobject%20Object%5D&name=image.png&originHeight=85&originWidth=1248&originalType=binary&ratio=1&rotation=0&showTitle=false&size=10461&status=done&style=none&taskId=u8abb8880-7b8e-45cb-91d7-daf6e64f818&title=&width=780)<br />(2)添加事件属性,事件类型为拼接。<br />(3)下面会出现左右两个表格以及选中取消两个按钮在左侧表格里面会出现已经选择的组切支持拼接的组件,选择加减乘除括号的下拉框,可以填数字的输入框。在你选择要拼接的组件后,点击选中会将选择的组件放入右边表格,如果选择错误可以在右边表格选择后点击取消,也可以选择下拉框中的符号,也可以选择添加数字。如图选择总水果数为苹果加香蕉。![image.png](https://cdn.nlark.com/yuque/0/2021/png/12997138/1637994834246-087a5f31-3ee2-4daf-9412-d5ed686686d4.png#clientId=u3c70aaf5-2324-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=483&id=ub3c5d6f6&margin=%5Bobject%20Object%5D&name=image.png&originHeight=483&originWidth=899&originalType=binary&ratio=1&rotation=0&showTitle=false&size=22810&status=done&style=none&taskId=u3b295b70-1dab-40a0-9dc8-fd741f8e7cc&title=&width=899)(4)点击预览图标,切换到预览模式即可查看效果。在省中输入安徽,在市中输入合肥,则自动拼接成安徽省合肥市显示在地址中。![image.png](https://cdn.nlark.com/yuque/0/2021/png/12997138/1637994919383-0c280fee-e94b-4714-9bf4-a7db9b1b1e30.png#clientId=u3c70aaf5-2324-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=105&id=u2b584e92&margin=%5Bobject%20Object%5D&name=image.png&originHeight=105&originWidth=1823&originalType=binary&ratio=1&rotation=0&showTitle=false&size=8267&status=done&style=none&taskId=ub6249ab8-0ef1-417e-b9e2-0d0c8ea9cb9&title=&width=1823)

4.弹窗


(1)添加按钮组件。
(2)添加事件属性,事件类型为弹窗。
(3) 可以选择弹窗方式为输入地址或选择表单。输入地址由用户手动输入弹窗的地址,选择表单则会显示已创建的所有表单。如图选择指定表单并确认。
image.png
(4)点击预览图标,切换到预览模式即可查看效果。点击按钮跳出指定页面的弹窗。image.png

5.调用接口

(1)如4添加按钮组件并添加事件属性,事件类型为调用接口。
(2)输入指定的接口,即可在预览时点击按钮调用接口。
image.png