1.表格设置:height="tableHeight"
<el-row class="tablediv" ref="tableContainer">
<el-col :span="24">
<el-table :data="tableData" highlight-current-row border :height="tableHeight">
<el-table-column type="index" label="序号" width="60" align="center"/>
<el-table-column prop="enterprisecode" label="企业编号" header-align="center" width="120" sortable="custom"></el-table-column>
<el-table-column prop="enterprisename" label="企业名称" header-align="center"></el-table-column>
<el-table-column prop="projectname" label="项目名称" header-align="center" sortable="custom"></el-table-column>
</el-table>
</el-col>
</el-row>
2.data配置
data: function () {
return {
tableHeight: 0, // 表格高度
tableData: []
};
},
3.mounted中代码
mounted() {
this.$nextTick(function () {
// 表格高度自适应
const rect = this.$refs.tableContainer.$el.getBoundingClientRect();
this.tableHeight = rect.height
// 监听窗口大小变化
let _this = this;
window.onresize = function() {
// 表格高度自适应
const rect = _this.$refs.tableContainer.$el.getBoundingClientRect();
_this.tableHeight = rect.height
}
})
}