Vue Lifecycle — which happens before page renders?-CodePudding

Using Vue 2, I want to run a check before any page elements are rendered, to determine whether the user is signed in and if so, redirect them to another page.

Looking at the Vue Lifecycle, it's my understanding that beforeMount is first in this cycle. However, the page still appears for half a second before redirecting (in my case, to Dashboard)

beforeMount() {
  firebase.auth().onAuthStateChanged((user) => {
    if (user) {  
      this.$router.push({ name: 'Dashboard'})
    }
  });
}

I've tried other Lifecycle options and none of the others work either. What am I doing wrong?

CodePudding user response：

Looking at the Vue's lifecycle diagram:

beforeCreate and created hooks are earlier than beforeMount. You should use either one of them.

CodePudding user response：

You have to use Guard for this. you have to check auth before going to route on router.js file. you can use beforeEnter into your route path.