Laravel Echo in Vue without using mounted hook

I am using larvavel echo to send a private notification to a user when a new comment is made on a post with the code below:

 mounted(){
 window.Echo.private(`App.User.${this.user.id}`)
.notification((notification) => {
    console.log(notification.comment);
});
}

This works, but the user data is access using mapState, so whenever I refresh the page, the user information is undefined. Is there a way I can use laravel echo without using the mounted hook or make the user state persistent across pages without even using vuex-persistedstate.

Currently what I am doing is setting a timer to delay until the user value is set in the mounted hook:

     if(this.$store.getters.isLoggedIn){
      this.$store.dispatch('setUser');
      this.$store.dispatch('fetchNotifications');
    }
    setTimeout(()=>{
   this.checkNotification();

  },3000)

This works but I don't think its the best approach.

from Recent Questions - Stack Overflow https://ift.tt/3nViLEI
https://ift.tt/eA8V8J