如何使 el-form-item 的高度自适应?
时间: 2024-06-21 12:03:06 浏览: 245
el-form-item 的高度可以通过设置 label-width 和 label-position 以及控制组件内部元素的高度来实现自适应。具体方法如下:
1. 设置 label-width 和 label-position。
通过设置 label-width 和 label-position 可以使表单项的高度自适应,例如:
```
<el-form :model="form" :label-width="80px" label-position="left">
<el-form-item label="姓名">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="地址">
<el-input v-model="form.address"></el-input>
</el-form-item>
</el-form>
```
2. 控制组件内部元素的高度。
通过设置组件内部元素的高度也可以使表单项的高度自适应,例如:
```
<el-form :model="form">
<el-form-item label="姓名">
<el-input v-model="form.name" style="height: auto;"></el-input>
</el-form-item>
<el-form-item label="地址">
<el-input v-model="form.address" style="height: auto;"></el-input>
</el-form-item>
</el-form>
```
阅读全文