vue实时监听获取屏幕尺寸大小

vue如何实时监听当前浏览器分辨率大小,根据不同分辨率执行不同操作,下面编程教程网小编给大家简单介绍一下具体实现代码!

具体代码如下:

data(){
  return{
    screenWidth: null, 
  }
},
mounted() {
  this.screenWidth = document.body.clientWidth
 
  window.onresize = () => {
    return (() => {
    this.screenWidth = document.body.clientWidth
    })()
  }
},
watch: {
  screenWidth: {
    handler: function (val) {
    if (val < 1024) {
      console.log(val + '屏幕宽度不能小于1024')
    } else {
      console.log(val + '屏幕宽度属于正常状态')
    }
    }
  },
}
以上是编程学习网小编为您介绍的“vue实时监听获取屏幕尺寸大小”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。

本文标题为:vue实时监听获取屏幕尺寸大小

基础教程推荐