vue获取到页面的高度_vue 动态获取可视区高度

个人学习笔记

data() {

fullHeight: '' ";//fullHeight: document.documentElement.clientHeight  屏幕高度 默认值

}

},

methods: {

changeFixed(fullHeight){                        //动态修改样式

this.$refs.qwcontent.style.height =( 0.91*fullHeight - 200)+'px';

}

},

mounted() {

this.fullHeight= `${document.documentElement.clientHeight}`;//默认值

const that = this

window.onresize = () => {

return (() => {

window.fullHeight = document.documentElement.clientHeigh

that.fullHeight = window.fullHeight

})()

}

},

watch: {

// 如果 `fullHeight ` 发生改变，这个函数就会运行

fullHeight :function(val) {

if(!this.timer) {

this.fullHeight = val

this.changeFixed(this.fullHeight)

console.log(val)

this.timer = true

let that = this

setTimeout(function (){//频繁触发 resize 函数，会导致页面很卡

that.timer = false

},100)

}

}

}