Vue

HTML

<div id="app">
  
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

li {
  margin: 8px 0;
}

h2 {
  font-weight: bold;
  margin-bottom: 15px;
}

del {
  color: rgba(0, 0, 0, 0.3);
}

Vue

new Vue({
  el: "#app",
  methods: {
    handleResize() {
      clearTimeout(this.windowValues.doIt);
      this.windowValues.doIt = setTimeout(() => {         // use an arrow function here so you can refer to the same 'this' inside setTimeout and get rid of the variable '_this'
        this.windowValues.winWidth = this.windowValues.newWinWidth;
        this.windowValues.newWinWidth = window.innerWidth;
        console.log("new " + this.windowValues.newWinWidth);
        console.log("old " + this.windowValues.winWidth);

        if(this.windowValues.newWinWidth > 1025 && this.windowValues.winWidth < 1025) {
          console.log("refresh now");
          //window.location.reload();
        }
        if(this.windowValues.newWinWidth < 1025 && this.windowValues.winWidth > 1025) {
          console.log("refresh again");
          //window.location.reload();
        }
      }, 1000);
    }
  },
  mounted: function() {
    this.windowValues = {                                 // define the object 'windowValues', this object will be used in 'handleResize'
      winWidth: window.innerWidth,
      newWinWidth: window.innerWidth
      // doIt will get assigned later so no need to define it here
    };

    window.addEventListener('resize', this.handleResize);
  }
})