vue监听浏览器窗口的变化,随着窗口变化调整里面table的宽高

Posted yangguoe

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue监听浏览器窗口的变化,随着窗口变化调整里面table的宽高相关的知识,希望对你有一定的参考价值。

1.在data中设置:

1  tableHeight:"500",
2  screenHeight:window.innerHeight,

2.在mounted中设置:

1   mounted() {
2       const that = this
3       window.onresize =()  =>{
4         return (()=>{
5           window.screenHeight = window.innerHeight
6           this.screenHeight = window.screenHeight;
7         })()
8       }
9     },

3.在watch中监听:

1   watch:{
2       screenHeight(val){
3         this.screenHeight = val
4         this.tableHeight = this.screenHeight - 250
5       }
6     },

 

以上是关于vue监听浏览器窗口的变化,随着窗口变化调整里面table的宽高的主要内容,如果未能解决你的问题,请参考以下文章

vue3.0监听浏览器窗口的变化

用JS或者jQuery可以监听浏览器窗口的变化吗

vue 监听窗口变化对页面部分元素重新渲染

C# wpf 想让控件随着窗口大小变化而变化

vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,windo

随着屏幕尺寸的变化不断调整元素尺寸