vue如何监听屏幕高度

这篇文章主要介绍“vue如何监听屏幕高度”的相关知识，小编通过实际案例向大家展示操作过程，操作方法简单快捷，实用性强，希望这篇“vue如何监听屏幕高度”文章能帮助大家解决问题。

首先需要在data里面定义页面的高度

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

把window.onresize事件挂在到mounted

mounted() {   const that = this   window.onresize = () => {    return (() => {     window.fullHeight = document.documentElement.clientHeight     that.fullHeight = window.fullHeight    })()   }  }

监听window.onresize事件

 watch: {   fullHeight (val) {    if(!this.timer) {     this.fullHeight = val     this.timer = true     let that = this     setTimeout(function (){      that.timer = false     },400)    }   }  }

为什么要使用Vue

Vue是一款友好的、多用途且高性能的JavaScript框架，使用vue可以创建可维护性和可测试性更强的代码库，Vue允许可以将一个网页分割成可复用的组件，每个组件都包含属于自己的HTML、CSS、JavaScript，以用来渲染网页中相应的地方，所以越来越多的前端开发者使用vue。

关于“vue如何监听屏幕高度”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识，可以关注编程网行业资讯频道，小编每天都会为大家更新不同的知识点。