title: Vue.js redirect to a new page/component if F5 is pressed
body: <p>New to vue.js here. 
  I have deployed a complete form website with 3 components : Id, Form and End</p>
  
  <p>Everything is working really well! I am only struggling with one action.</p>
  
  <p>If a user hits F5 to reload the page when he is on the component /Form, the page goes blank... which is a pretty bad experience... What I have done is, I added a window.onbeforeunload action, it will display a popup asking if the user really wants to leave the page. If user answers "leave", I want the page to redirect to /Id. </p>
  
  <p>Current Scenario is : 
  /Id ---> /Form ---> F5 ---> pop up confirm leave page --yes--> /Form (blank page)</p>
  
  <p>What I would like is :
  /Id ---> /Form ---> F5 ---> pop up confirm leave page --yes--> /Id</p>
  
  <p>When I run window.onbeforeunload as below, it works well :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>window.onbeforeunload = function(){
      return "Are you sure?";
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>But when I try to use the combination of window.onbeforeunload and        this.$router.push('/Id'), it does not seem to work at all... or I am just doing it wrong.</p>
  
  <p>Here is how I tried to add this.$router.push('/Id') :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;script&gt;
  import axios from 'axios'
  var answer =''
  
  window.onbeforeunload = function(){
    var answer = confirm('Are you sure?');
    if (answer == 'true'){
      this.$router.push('/Id')
    }
    return answer;
  }
  
  export default {
    data () {
      return {
        
        form: {
          ....
        },
      }
    },
    
    methods: {
      ....
      }
     ....
     ...
   ...</code></pre>
  </div>
  </div>
  </p>