vue页面自适应浏览器高度

1. 获取浏览器高度

data(){
    return{
      fullHeight: document.documentElement.clientHeight
    }
  },

2. 动态获取浏览器高度

watch: {
    fullHeight (val) {//监控浏览器高度变化
        if(!this.timer) {
            this.fullHeight = val
            this.timer = true
            let that = this
            setTimeout(function (){
                that.timer = false
            },400)
        }
    }
},
mounted () {
    this.get_bodyHeight()
},
methods :{
    get_bodyHeight () {//动态获取浏览器高度
        const that = this
        window.onresize = () => {
            return (() => {
                window.fullHeight = document.documentElement.clientHeight
                that.fullHeight = window.fullHeight
            })()
        }
    }
}

3. 设置样式

:style="'height:'+(fullHeight*0.93)+'px;'"