<template>
<div :style="heightStyle">
</div>
</template>
export default {
data(){
return {
// 默认屏幕高度属性
fullHeight: 0,
heightStyle:{
height:''
}
}
},
watch: {
//动态监听
fullHeight(val){
if(val !== undefined){
this.beforeMount(val);
}
}
},
mounted() {
// 初始加载高度
this.fullHeight = `${document.documentElement.clientHeight}`;//默认值
this.heightStyle.height = this.fullHeight + 'px';
const that = this;
window.onresize = () =>{
//动态赋值
that.fullHeight = window.innerHeight;
that.heightStyle.height = (that.fullHeight - 215) + 'px'
}
//防止空值出现
if(that.fullHeight){
this.heightStyle.height = that.fullHeight - 215 + 'px';
}else{
this.heightStyle.height = 400 + 'px'
}
},
methods: {
//监听调用的函数
beforeMount(height) {
console.log(height,"改变后");
},
},
}
