【vue3中el-table表格高度自适应】

分享一种开发中遇到的比较方便的表格高度自适应方案

template代码

<div class="page"><div class="table_wrap"><el-table></el-table></div>
</div>

css代码
将el-table设置为绝对定位，相对于父元素定位且高度100%，这样表格就会占据它父元素的全部高度。
父元素的高度设置为flex:1，将根据页面的高度进行适配。

.page {display: flex;.table_wrap {flex: 1;height: 100%;position: relative;:deep(.el-table) {position: absolute;height:100% !important; // 重要}}
}