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
        }
      },
    },
  },

你可能感兴趣的:(vue监听屏幕宽度变化)