实现效果:
方法:
html:
JS:
<script> export default { data(){ return { clientHeight:'', } }, mounted(){ // 获取浏览器可视区域高度 this.clientHeight = `${document.documentElement.clientHeight}` //document.body.clientWidth; //console.log(self.clientHeight); window.onresize = function temp() { this.clientHeight = `${document.documentElement.clientHeight}`; }; }, watch: { // 如果 `clientHeight` 发生改变,这个函数就会运行 clientHeight: function () { this.changeFixed(this.clientHeight) } }, methods:{ changeFixed(clientHeight){ //动态修改样式 console.log(clientHeight); this.$refs.homePage.style.height = clientHeight+'px'; }, } } </script>获取clientHeight高度,监听发生变化时执行changeFixed函数动态修改样式