FormItem 表单项
说明
y-form-item 整合 el-form-item + el-col,需与 Form 表单 配合使用。
用法示例(布局、联动、防抖等)见 Form 表单 · 用法示例。
注意:
- 未设置
span时继承y-form的span - 属性会分发给
el-col或el-form-item
用法示例
API
Attributes
支持 FormItem Attributes 及 Col Attributes 的全部属性。下表列出常用项;未列出的 el-form-item 属性同样支持透传。
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| span | 栅格占据列数,同 el-col | number | 继承 y-form |
| offset | 栅格左侧间隔格数,同 el-col | number | 0 |
| push | 向右移动格数,同 el-col | number | 0 |
| pull | 向左移动格数,同 el-col | number | 0 |
| xs | <768px 响应式栅格,同 el-col | number / object | — |
| sm | ≥768px 响应式栅格,同 el-col | number / object | — |
| md | ≥992px 响应式栅格,同 el-col | number / object | — |
| lg | ≥1200px 响应式栅格,同 el-col | number / object | — |
| xl | ≥1920px 响应式栅格,同 el-col | number / object | — |
| tag | 自定义元素标签,同 el-col | string | 'div' |
| label | 标签文本,同 el-form-item | string | — |
| prop | 模型字段名,同 el-form-item | string / object | — |
| rules | 校验规则,同 el-form-item | object | — |
| label-width | 标签宽度,同 el-form-item | string / number | — |
| required | 是否必填,同 el-form-item | boolean | — |
| inline-message | 是否行内展示校验信息,同 el-form-item | boolean | — |
Slots
| 名称 | 说明 | 参数 |
|---|---|---|
| default | 表单控件内容 | — |
| label | 自定义标签内容 | object |
| error | 自定义校验错误内容 | object |
Exposes
| 名称 | 说明 | 类型 |
|---|---|---|
| size | 表单项尺寸,同 el-form-item | object |
| validateMessage | 校验提示信息,同 el-form-item | object |
| validateState | 校验状态,同 el-form-item | object |
| validate | 校验表单项,同 el-form-item | function |
| clearValidate | 移除该表单项的校验结果,同 el-form-item | function |
| resetField | 重置该表单项为初始值并移除校验结果,同 el-form-item | function |
| setInitialValue | 设置该字段初始值,resetField 时将重置到此值,同 el-form-item | function |
