title: Modal 对话框 nav: title: 组件 path: /components order: 1 group: title: ' ' path: /modal order: 126

Modal - 对话框

基于 antd modal 封装，简化了 Modal 操作，将 form 集成到了 modal 中，支持 fields 属性配置生成。在确定时，自动校验表单数据，并提交，成功后关闭弹窗。

传入 fields

confirmLoading

1. 如果传入 conformLoading, 表示 ok button 的 loading 状态由外部控制;
2. 没传入 confirmLoading, 且 onOk 返回为 Promise, 则内部会自动处理 loading 状态;
3. 当 onOk 执行完返回 false, 或 onOk 返回的 Promise resolve false 的时候, 表示不关闭弹窗;

API

| 参数 | 说明 | 类型 | 默认值 | 版本 | | -------------- | ----------------------------- | ---------------------- | ------------ | ---- | | fields | form 中 fields 属性 | Array | | form | 外部 form, 没有内部会默认创建 | undefined | FormInstance | | column | 控制 Modal 中 Form 的列数 | number | | endChildren | 渲染在 Form 之后的节点 | ReactNode | null | | data | form 表单数据 | Object | | contentLoading | 内容加载 Loading | Boolean | false | | confirmLoading | 确定按钮状态 | Boolean | false | | extraAction | 额外操作按钮 | ({ onOk })=> ReactNode | undefined |

其余参照 antd modal

onOk 方法需要返回 promise，控制是否关闭弹框