Vue real-time past page width and height

mounted () { 
    let that = this ;
     // <!-Hang the window.onresize event on the mounted function-> 
    window.onresize = () => {
       return (() => { 
        window.fullHeight = document .documentElement.clientHeight; 
        window.fullWidth = document.documentElement.clientWidth; 
        that.windowHeight = window.fullHeight; // High 
        that.windowWidth = window.fullWidth; // Width 
      }) (); 
    }; 
  },
watch: { 
      windowHeight (val) { 
        let that = this ;
         // console.log ("Live screen height:", val, that.windowHeight); 
      }, 
      windowWidth (val) { 
        let that = this ;
         // console.log ("Real-time screen width:", val, that.windowHeight); 
      } 
    },
data () {
     return { 
      circleUrl: 
        " https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png " , 
      size: " small " , 
      isCollapse: false , 
      windowWidth: document.documentElement.clientWidth, // Real-time screen Width 
      windowHeight: document.documentElement.clientHeight // Real-time screen height 
    }; 
  },

 

Guess you like

Origin www.cnblogs.com/wangshishuai/p/12727150.html