Vue listens for window size changes

Use window.onresize to listen for page window size changes

mounted() {
    let _this = this;
    _this.setSize()
    _this.getData()
    window.onresize = () = > {
      return (() = > {
        window.screenWidths = document.body.clientWidth// Get the page port width
        _this.screenWidths = window.screenWidths/ / assignment screenWidths
        _this.setSize()// Trigger the event}}}) ()Copy the code

Use watch to monitor size changes in real time and add timers

  watch: {
    monitorWidths(val){
      console.log(val)
      this.screenWidths = val
      setTimeout(function(){},200) // To avoid page stalling due to frequent resize triggers, use a timer}},Copy the code