el-form中,el-form-item里的el-input有两种,一种是独占一行,一种是一行有多个
时间: 2023-12-30 11:48:43 浏览: 85
在 `el-form` 中,`el-form-item` 可以包含多个表单控件,如 `el-input`、`el-select` 等。而在 `el-form-item` 中的 `el-input` 控件可以设置 `span` 属性,用于控制该控件所占据的列数。
当 `span` 属性设置为 `24` 时,`el-input` 将会独占一行,如下所示:
```html
<el-form>
<el-form-item label="姓名">
<el-input v-model="name" placeholder="请输入姓名" :span="24"></el-input>
</el-form-item>
</el-form>
```
当 `span` 属性设置为小于 `24` 的值时,`el-input` 将会与其他控件共同占据一行,如下所示:
```html
<el-form>
<el-form-item label="性别">
<el-radio-group v-model="gender" :span="12">
<el-radio label="male">男</el-radio>
<el-radio label="female">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
<el-input v-model="age" placeholder="请输入年龄" :span="12"></el-input>
</el-form-item>
</el-form>
```
在上面的示例中,`el-radio-group` 控件和 `el-input` 控件都设置了 `span` 属性,它们共同占据一行,其中 `el-radio-group` 控件占据了 12 列,`el-input` 控件占据了 12 列。
阅读全文