vue动态获取页面宽高及默认宽度

进入页面自动获取页面宽度：

 

mounted() {
    
    var that = this;
    console.log('页面进入时的宽度：',document.body.clientWidth)
    if(document.body.clientWidth<768){
      this.dialogWidth='100%'
    }

  },

动态获取页面宽高

mounted() {
    var that = this;
    // <!--把window.onresize事件挂在到mounted函数上-->
    window.onresize = () => {
      return (() => {
        window.fullHeight = document.documentElement.clientHeight;
        window.fullWidth = document.documentElement.clientWidth;
        that.windowHeight = window.fullHeight;  // 高
        that.windowWidth = window.fullWidth; // 宽
      })()
    };

  },



watch:{
    windowHeight (val) {
      let that = this;
      console.log("实时屏幕高度：",val, that.windowHeight );
    },
    windowWidth (val) {
      let that = this;
      if(val<768){
        that.dialogWidth='100%'
      }else{
        that.dialogWidth='75%'
      }
      console.log("实时屏幕宽度：",val, that.windowHeight );
    }
  }