vue监听屏幕宽度变化

不多说,直接上代码 dddd

data(){
   retrun {
      screenWidth:null,
      dialogWidth:0,
   }
},
mounted() {
    this.screenWidth = document.body.clientWidth
    window.onresize = () => {
      return (() => {
        this.screenWidth = document.body.clientWidth
      })()
    }
},
watch: {
    screenWidth: {
      handler: function (val, oldVal) {
        if (val < 800) {
          this.dialogWidth = '400px'
          //此刻屏幕宽度小于800
        } else {
          this.dialogWidth = '800px'
          //此刻屏幕宽度大于800
        }
      },
    },
  },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容