vue table表格高度自适应
时间: 2023-06-30 12:22:53 浏览: 151
可以通过设置表格的高度为"auto",让表格高度自适应,如下所示:
```html
<template>
<div>
<el-table :data="tableData" :height="'auto'">
<el-table-column prop="name" label="Name"></el-table-column>
<el-table-column prop="age" label="Age"></el-table-column>
<el-table-column prop="address" label="Address"></el-table-column>
</el-table>
</div>
</template>
```
同时,如果表格数据较多,可以设置表格的最大高度和溢出方式,如下所示:
```html
<template>
<div>
<el-table :data="tableData" :height="'auto'" :style="{ 'max-height': '300px', 'overflow-y': 'auto' }">
<el-table-column prop="name" label="Name"></el-table-column>
<el-table-column prop="age" label="Age"></el-table-column>
<el-table-column prop="address" label="Address"></el-table-column>
</el-table>
</div>
</template>
```
这样可以让表格在数据较多时,自适应高度,并且超出最大高度时,出现滚动条。
阅读全文