基于element-ui的el-form组件进行封装的,加了很多日常使用的属性及方法。主要用于数据的创建、修改、详情窗口显示。
属性
| 参数 | 说明 | 类型 | 默认值 |
| idKey | id值 | string | id |
| showLoading | 是否使用加载 | boolean | true |
| textMode | 是否启用详情样式,默认是以编辑样式处理 | boolean | false |
| showSaveButton | 是否显示保存按钮 | boolean | false |
| getGuidOnCreate | 的最大高度,超过后会出现坚向滚动条 | boolean | false |
| labelWidth | 表单的字段标签宽度 | string | 85px |
| rules | 表单的验证规则 | object | |
| labelPosition | 标签对齐位置 | | |
| data | 数据对象 | object | |
| savedMessage | 保存后提示消息 | string | 保存成功 |
| beforeSave | 保存之前,返回true进行保存,返回false不进行保存 | function | |
| confirmOnSave | 是否在保存时弹出确认提示 | boolean | false |
| confirmSaveText | 保存确认提示文字 | string | 您确定要保存吗? |
| saveButtonText | 保存按钮的文本 | | 保存 |
| getDataFunc | 获取数据的函数 | function | null |
| saveFunc | 保存数据的函数 | function | null |
事件
| 事件名 | 说明 | 参数 |
| created | 当表单被调用create方法打开后,会传入窗口的data数据 | object |
| edited | 当窗口被调用edit方法打开后,会传入窗口的data数据 | object |
| detailed | 当窗口被调用detail方法打开后,会传入窗口的data数据 | object |
| data-got | 当获取详情数据后 | object |
| saved | 当数据保存后 | |
方法
| 方法名 | 说明 | 参数 |
| create | 打开创建表单 | object |
| edit | 打开编辑表单 | object |
| editById | 打开编辑表单,传入id | number |
| detail | 打开详情表单 | object |
| detailById | 打开详情表单,传入id | number |
| loading | 设置窗口加载状态 | boolean |
| change | 更改表单数据的变动状态 | boolean |
| reset | 重置表单数据 | |
| setData | 设置表单数据 | object |
| reload | 刷新表单数据 | |
| getData | 获取表单数据 | number |
| validate | 验证表单字段 | |
| save | 保存表单数据,传入true为强制保存 | boolean |
| clearValidate | 清空表单验证信息 | |
Slots