eo-form
<eo-form>Alias:
<form.general-form>表单构件。
Examples
Layout
Values
Events
Method
Theme variant Elevo
Properties
| Name | Description | Type | Default | Required |
|---|---|---|---|---|
staticValues | Record<string, unknown> | |||
layout | 布局方式(默认 vertical 布局) | Layout | vertical | |
size | 表单组件尺寸 | ComponentSize | ||
labelCol | 标签列布局样式(仅当 layout="horizontal" 时有效) | ColProps | {
sm: {
span: 24,
},
md: {
span: 24,
},
lg: {
span: 7,
},
xl: {
span: 5,
},
xxl: {
span: 4,
},
} | |
wrapperCol | 输入控件列布局样式(仅当 layout="horizontal" 时有效) | ColProps | {
sm: {
span: 18,
},
md: {
span: 18,
},
lg: {
span: 13,
},
xl: {
span: 16,
},
xxl: {
span: 18,
},
} | |
autoScrollToInvalidFields | boolean | |||
formStyle | React.CSSProperties | |||
textContent | 文本内容 | string |
Slots
| Name | Description |
|---|---|
| (default) | 表单内容 |
Events
| Name | Description | Event Detail |
|---|---|---|
values.change | 表单值变更事件 | Record<string, unknown> |
validate.success | 表单验证成功时触发事件 | Record<string, unknown> |
validate.error | 表单验证报错时触发事件 | (MessageBody & { name: string })[] |
Methods
| Name | Description | Params | Returns |
|---|---|---|---|
validate | 表单校验方法 | boolean | Record<string, unknown> | |
setInitValue | 表单设置值方法 | values: Record<string, unknown>, options: { runInMacrotask?: boolean; runInMicrotask?: boolean } | |
resetFields | 表单重置值方法 | name: string | |
getFieldsValue | 获取表单值方法 | name: string | |
validateField | 校验表单字段方法 | name: string | |
resetValidateState | 重置表单校验状态方法 |
Type references
Layout
"horizontal" | "vertical" | "inline"ComponentSize
"large" | "medium" | "small" | "xs"