CODEWITHSUNDEEP
vue.jsvue-router
VBAHole
VBAHole

Reputation: 1518

Load values into vue.js router guard before it is called

I am setting up a vue.js router guard in my main.js file. But i have a list of entitlements that needs to be passed into that router guard. I am fetching the needed entitlement list into the store in my App.vue created method - but i think it is too late for the router guard. My entitlement list is not available to the guard at the time it is initialized. Where can i load the entitlements so they will be ready for the guard when it needs them?

  router.beforeEach((to, from, next) => {
     entitledBeforeEach(to, from, next, store.getters.ENTITLEMENTS); });

that getter will always return null because main.js has not fetched the entitlements yet. How can i do that sooner?

Upvotes: 0

Views: 239

Answers (1)

Steven Spungin
Steven Spungin

Reputation: 29179

In your store, use an action instead of a getter. The actions can be async, and should resolve once your entitlements are loaded or reused from a previous request.

router.beforeEach((to, from, next) => {
  store.dispatch('getEntitlements').then(entitlements => {
     // Do your processing and setup here.
     // There are many ways to get the entitlements into your component...
     next();
  });

Upvotes: 1

Related Questions