主题
基本用法
vue
和 hl-dialog 相比,hl-form-dialog 做了一下几点
预置了提交按钮,只需要绑定提交方法
点击提交按钮会触发表单校验,不需要再手动触发
提交表单后组件会调用绑定的server方法,server必须返回一个promise,promise失败会弹出失败信息,成功则会提示“保存成功”,无需再手动提示
提交成功后会自动触发refresh事件,可以在父组件中绑定该事件用于刷新数据
弹框关闭时重置表单校验
属性
属性 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
title | 标题 | String | — | — |
rules | el-form校验规则 | Object | — | — |
model | el-form的model | Object | — | null |
width | 弹框宽度 | Number/String | — | 500px |
top | 弹框距离顶部的距离 | Number/String | — | 150px |
submitText | 提交按钮文本 | String | — | 提交 |
inline | 是否一行显示两个表单项 | Boolean | — | false |
server | 提交调用的方法,返回值必须是一个Promise | Function | — | null |
labelWidth | 表单项label宽度 | String/Number | — | 80px |