How to use vuex store without access to vue instance?

Fragster

E.g in beforeRouteEnter hook?
I try make it in this way (store is dynamically filled in boot folder):

import StoreFunction from 'store';
const store = StoreFunction();
...
export default {

  beforeRouteEnter(to, from, next) {
    if (store.state.catalog.loading) next({to: 'routename'});
    else next();
  }

but it causes an error “do not mutate vuex store state outside mutation handlers.”

to fix it, I change store/index.js to return store instance instead of function, and it works. But I’m worrying about possible side effects of this ‘fix’.

//export default function(/* { ssrContext } */) {
  export default new Vuex.Store({

Is this right fix, or there is another ‘proper’ way in my case?

tof06

@Fragster
It should be confirmed by a more a experienced dev than me, but if you’re not building for SSR mode, you can export directly the Store instance like you did.

What I’ve done is something similar :


const Store = new Vuex.Store({...})

export { Store }
export default function (/* ssrContext */) {
  return Store
}

This way, I export both the function (default export), and the instance
And, when I need to access Store outside component, I just import { Store } from 'src/store'

blakeyuk

Excellent! Two years later, and still useful. Thanks @tof06

devinsmith0444

Accounting tools can be of great assistance, so as totackle out different processes and tasks. In today’s post, we will be learning the procedure to access different accounting tools in QuickBooks desktop enterprise. Accounting tools can be a saviour in majority of cases.

To know more about accessing accounting tools in QuickBooks desktop enterprise, make sure to read this post till the end.

alexmalcova

No More Posting New Topics!

How to use vuex store without access to vue instance?