## 基础使用 Form 组件是一个具有校验和提交功能的表单,包含复选框、单选框、输入框、下拉选择框等元素。
- 立即创建 取消
```html ``` ## Inline Form
查询
```html ``` ## Stacked Form
立即创建 取消
```html ``` ## 标签左对齐
查询
```html ``` ## 无标签
登录
```html ``` ## 表单验证
-
提交 重置
```html ``` ## 自定义校验规则
提交 重置
```html ``` ## 动态增减表单项
删除 提交 新增域名
```html ``` ## el-form API ### 组件属性和事件 | 参数 | 说明 | 类型 | 可选值 | 默认值 | |---------- |-------------- |---------- |-------------------------------- |-------- | | model | 表单数据对象 | object | | | | rules | 表单验证规则 | object | | | | type | 表单类型 | string | stacked, inline, horizontal | horizontal | | label-align | 表单域标签的水平对齐位置 | string | right,left | right | | label-width | 表单域标签的宽度,所有的 form-item 都会继承 form 组件的 labelWidth 的值 | string | | | | label-suffix | 表单域标签的后缀 | string | | | ### el-form 实例属性和方法 | 方法名 | 说明 | 类型 | 默认值 | |---------- |-------------- |---------- |-------- | | validate(cb) | 对整个表单进行校验的方法, 校验结束后会调用传入的回调方法, cb(valid), valid 参数是校验 bool 值结果 | function | | | validateField(prop, cb) | 对部分表单字段进行校验的方法 | | | | resetFields | 对整个表单进行重置,将所有字段值重置为空并移除校验结果 | | | ## el-form-item API | 参数 | 说明 | 类型 | 可选值 | 默认值 | |---------- |-------------- |---------- |-------------------------------- |-------- | | prop | 表单域model字段 | string | 传入父级 v-form 的 model 中的所有属性 | | | label | 标签文本 | string | | | | label-width | 表单域标签的的宽度,例如 '50px' | string | | | | required | 是否必填,如不设置,则会根据校验规则自动生成 | bolean | | false |