弹窗组件
在设计器中,您可以创建和管理弹窗组件,以便在表单中按需打开和使用。弹窗可用于展示额外信息、接受用户输入或进行其他交互操作。
数据结构
打开弹窗
使用 api.open
方法可以打开指定的弹窗。id
为弹窗的ID
,formData
可选,用于设置弹窗中的默认表单值。
ts
type Open = (id: string, formData?: Object) => void;
关闭弹窗
使用 api.close
方法可以关闭指定的弹窗。
ts
type Close = (id: string) => void;
打开弹窗
在组件的事件中调用 api.open 方法即可打开弹窗。例如:
js
function onChange($inject) {
$inject.api.open('ref_F2vulxvqc841dac');
}
手动关闭弹窗
在组件的事件中调用 api.close
方法即可关闭弹窗。例如:
js
function onChange($inject) {
$inject.api.close('ref_F2vulxvqc841dac');
}
打开弹窗并设置表单默认值
api.open
方法的第二个参数可以设置弹窗表单的默认值。例如:
js
function change($inject) {
$inject.api.open('ref_F2vulxvqc841dac', {
name: 'name'
});
}
提交表单
通过弹窗组件的 submit
事件可以提交表单。例如:
js
function submit($inject) {
//todo 提交表单
}
在弹窗中触发最外层表单的提交
使用 api.top.submit
方法可以手动触发最外层表单的提交。例如:
js
function submit($inject) {
$inject.api.top.submit();
}