1

I am trying to access the value from the VueX Store in beforeEnter hook I tried accessing it directly using the store object or even accessing the getter function via store object but still return empty object even though I can see the value in the store object

async getCurrentUser(to, from, next) {
        
        console.log("getUserState");
        console.log(Store.store);
        console.log(Store.store.state.auth.user);
        console.log("finish");
}

I am using the above method in router.js in beforeEnter hook.

{
      path: "/dashboard",
      name: "dashboard",
      components: {
        header: DashboardHeader,
        default: Dashboard,
        footer: DashboardFooter
      },
      beforeEnter: Guards.getCurrentUser
    }

click here to see output on console of the getCurrentUser function

As you can see that value is there but when I access it directly in the below line it's an empty object. I accessing it in a javascript module which is below

import * as Store from './store/store'

export default {

    async getCurrentUser(to, from, next) {
        
        console.log(Store.store);
        console.log(Store.store.state.auth.user);
      
      }

}
  • When you look at the line, there should be a little "i" next to it. It says that the object is evaluated when you open it. In other words, your second line is empty, because at that moment the object is empty. The state gets updated after this function, and when you open the store you see it. If you see differences like these, put a debugger statement afterwards so you can browse the store *exactly* how it was at that point in time, then resume execution. Use the Vue debugger tools to see when each commit is happening. – Sumurai8 Oct 02 '20 at 10:23
  • Does this answer your question? [When does the javascript console evaluate the contents of a printed object?](https://stackoverflow.com/questions/31866685/when-does-the-javascript-console-evaluate-the-contents-of-a-printed-object) – Sumurai8 Oct 02 '20 at 10:24

0 Answers0