state values not accessible in dynamic modules

I’d like to report a bug

Given the following code:

@Module({ dynamic: true, store, name: 'user' })
class User extends VuexModule implements IUserState {
  token = 'something';

  @MutationAction({ mutate: [ 'roles', 'name', 'avatar' ] })
  async GetInfo(input: string) {
    log.debug(this.token)
    log.debug(input)
   ...
  }

When executing this MutationAction from outside the module, the logging of this.token returns undefined. However, If I pass the value from this module from outside this module as the input parameter, then I can get the correct value:

UserModule.GetInfo(UserModule.token).then(() => { ... }

So UserModule.token does provide the correct value, only you need to re-enter it in the module… which does not make much sense, but it’s a workaround anyway.

I also observed that while debugging, the token value inside the Module can be accessed by using this.state.token instead of this.token. The only problem with this, is that typescript does not accept this as valid typings…

I don’t know if this has something to do with dynamic modules or a more generic bug. Just leaving this here.

[darylteo]

I ran into maybe a similar issue and racked my brains for quite awhile until I figured it out.

vuex-module-decorators does not know if your module is namespaced or not and may get confused. That’s what the namespaced option in the @Module decorator is for.

I think for 99% percent of use cases this should be set to true.

[Kapcash]

I’m having the same issue, and I don’t find any elegant workaround. I don’t get why we can’t access the state within an action, in the vuex documentation this seems to be allowed.

Anyway, and as hectorj is mentionning, accessing the state within an action method using getters doesn’t work either.