Search code examples
javascriptvue.jslocationreload

vue refresh the page only once


Is it possible to reload a page when it is created or mounted or something similar? let me explain, I would like that when a page is loaded, we must activate location.reload(); but if I do it on created(), or on mounted() I get a loop loading. instead I would like to reload only the first time, so I enter that page and the page reloads only once.

I tried with:

 created() {
   if(this.reloaded == false) {
       location.reload();
       this.reloaded = true;
   }
 },
 data() {
   return {
     reloaded: false,
   };
 },

Solution

  • Because you're reloading the page, you can't store the state within the Vue instance. Instead, you can store it in local storage:

    export default {
     created() {
       const reloaded = localStorage.getItem('reloaded');
       if (reloaded !== 'true') {
           localStorage.setItem('reloaded', 'true');
           location.reload();
       }
     }
    }