type: Form

提供了在DPL中适用于表单中进行数据提交、状态切换的控制能力, 目前支持接入表单作为可操控表单项的组件有：Input 组件类型。

demo

events

名称	参数	参数说明	event说明
onReady	componentIds: componentId[]	当前表单中注册的组件列表	从存在表单项未完成验证到所有表单项均完成验证时触发
onPrepare	componentIds: componentId[]	当前表单中注册的组件列表	从所有表单项均完成验证到存在表单项未完成验证时触发
onSubmit	value	表单中对应表单项内容值，基于 sumbit 提交形式参数类型可以为不同的提交方式	通过调用 submit 方法，验证通过时触发
onValidateFail	value	errorMsg	通过调用 submit 方法，验证失败时触发

methods 方法

可以通过 InvokeMethod 指令调用的 Form 能力方法：

方法名	参数	参数说明	方法描述
submit	type: enum, componentIds: componentId[]	type：string：基于注册先后顺序字符串形式拼接、object：基于componentId：value的key-value对象形式、array：基于注册先后顺序的值数组形式；componentIds: 需要作用到的组件id数组列表	提交表单内容
select	status: boolean，componentIds: componentId[]	status: 是否选择；componentIds: 需要作用到的组件id数组列表	选择/取消选择，仅支持select能力的表单项组件可生效
disable	status: boolean，componentIds: componentId[]	status: 是否禁用；componentIds: 需要作用到的组件id数组列表	表单项组件禁用、取消禁用
clear	componentIds: componentId[]	componentIds: 需要作用到的组件id数组列表	清除数据，仅支持输入能力的表单项组件可生效
reset	componentIds: componentId[]	componentIds: 需要作用到的组件id数组列表	重置数据
blur	componentIds: componentId[]	componentIds: 需要作用到的组件id数组列表	使对应组件失去焦点

能力样例

{
    "type": "dpl",
    "version": "2.0",
    "duration": 66000,
    "stylesheet": [],
    "dataSource": {},
    "events": [],
    "abilities": [
        {
            // 能力类型：表单
            "type": "Form",
            // 对应能力的id，在组件中若需要接入该表单，需要明确声明：formId：该表单Id
            "componentId": "form_validate_code",
            "events": {
                // 从存在表单项未完成验证到所有表单项均完成验证时触发
                "onReady": [{{COMMANDS}}, ...],
                // 从所有表单项均完成验证到存在表单项未完成验证时触发
                "onPrepare": [{{COMMANDS}}, ...],
                // 通过调用 submit 方法，验证通过时触发
                "onSubmit": [{{COMMANDS}}, ...],
                // 通过调用 submit 方法，验证失败时触发
                "onValidateFail": [{{COMMANDS}}, ...],
            }
        },
        ...
    ],
    "mainTemplate": {
        "items":[
            ...,
            {
                "type":"Input",
                "componentId": "demo_input1",
                "styles": {
                    ...
                },
                "props": {
                    // 声明该可用作表单项的组件注册到 componentId 为 form_validate_code 的表单上
                    "formId": "form_validate_code",
                    "type": "number",
                    "theme": "dark",
                    "maxLength":1,
                    "placeholder": "",
                    "value": "",
                    // 数据验证规则，组件或表单的submit方法提交表单项输入值时会先通过该规则进行验证（正则匹配）, 不填默认不验证提交
                    "rule": {
                        "pattern": "^\\d{1}$"
                    },
                    // 输入组件内部样式
                    "inputStyle": {
                        ...
                    },
                    ...
            }
        ]
    },
    ...
}