页面放大缩小时，el-table高度随之变化

最新推荐文章于 2024-04-15 20:57:42 发布

胡歌1

最新推荐文章于 2024-04-15 20:57:42 发布

阅读量1.1k

点赞数 1

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/guapilixianghe/article/details/127202240

版权

1.画了一个vue面，想让这个页面中的el-table部分做到随着页面的放大或缩小而改变。

Mounted(() => {
				window.onresize = function windowResize(){
					let that = _this;
					_this.tableHeight = window.innerHeight - 100 - 280  + "px";
				}
            })

上面-100，-280，指的是el-header，el-footer的高度，el-main里只有一个el-table。

   <el-header style="height: 100px;width: 100%;"></el-header>  
    <el-main  style="width: 100%;margin-top:0px;margin-bottom: 0px;padding-top: 0px;padding-bottom: 0px;">	
        <el-table style="padding-top: 0px;padding-bottom: 0px;" :height="tableHeight">
        </el-table>
    </el-main>
     <el-footer style="height: 280px;width: 100%;position: fixed;bottom: 0px;"></el-footer>