vue+elementUI 实现内容区域高度自适应

//defaultHeight是绑定的属性
<el-main :style="defaultHeight">
<router-view />
</el-main>


//注意:这里的defaultHeight必须是对象,不懂的可以去官网看下api
data() {
return {
defaultHeight: {
height: ""
}
};
},
methods: {
//定义方法,获取高度减去头尾
getHeight() {
this.defaultHeight.height = window.innerHeight - 90 + "px";
}
},
created() {
//页面创建时执行一次getHeight进行赋值,顺道绑定resize事件
window.addEventListener("resize", this.getHeight);
this.getHeight();
}

 

 

 

原地址:https://www.cnblogs.com/jwen1994/p/13571720.html

posted @   鸡毛换糖  阅读(213)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示