行内样式的高度是一个变量,并且让页面的高度随浏览器的高度发生变化

想要让页面的高度跟着浏览器的高度发生变化,可以将 height 设置成一个变量, 并通过 :style="{height: height}" 的形式给元素绑定,并且在浏览器高度发生变化时,重新计算页面的高度

html代码:

<div  style="overflow: auto" :style="{height: height}"></div>

js代码:

data() {
    return {
        height: document.documentElement.clientHeight - 400 + 'px', //页面高度
    }
},
mounted() {
    this.refreshTable()//窗体刷新
},
methods: {
    //窗体刷新
    refreshTable() {
        let vm = this;
        window.onresize = () => {
            return (() => {
                vm.height = document.documentElement.clientHeight - 400 + 'px';
            })();
        };
    },
}

猜你喜欢

转载自blog.csdn.net/wytraining/article/details/102623802