Form 表单

继承el-form所有属性

表单包含 输入框, 单选框, 下拉选择, 多选框 等用户输入的组件。 使用表单，您可以收集、验证和提交数据。

典型表单

最基础的表单包括各种输入表单项，比如input、select、radio、checkbox等。

TIP

W3C 标准定义：

当一个表单中只有一个单行文本输入字段时， 浏览器应当将在此字段中按下 Enter （回车键）的行为视为提交表单的请求。 如果希望阻止这一默认行为，可以在 <g-form> 标签上添加 @submit.prevent。

Form API

Form Attributes

属性名	说明	类型	默认值
model	表单数据对象	object Record<string, any>	—
rules	表单验证规则	object FormRules	—
label-width	标签的长度，例如 '50px'。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。	string / number	''
show-message	是否显示校验错误信息	boolean	true
disabled	是否禁用该表单内的所有组件。 如果设置为 true, 它将覆盖内部组件的 disabled 属性	boolean	false

Form Slots

事件名	说明	子标签
default	自定义默认内容	FormItem

FormItem Attributes

属性名	说明	类型	Default
label	标签文本	string	—
label-width	标签宽度，例如 '50px'。 可以使用 auto。	string / number	''
required	是否为必填项，如不设置，则会根据校验规则确认	boolean	—
rules	表单验证规则, 具体配置见下表, 更多内容可以参考async-validator	^[object]Arrayable<FormItemRule>	—
error	表单域验证错误时的提示信息。设置该值会导致表单验证状态变为 error，并显示该错误信息。	string	—
show-message	是否显示校验错误信息	boolean	true

FormItem Slots

插槽名	说明	类型
default	表单的内容。	—