使用 Vuex-module-decorator 的 Nuxtjs 不会说话

Question

I want to use my vuex modules as classes to make my code more clean and readable. I used the section (Accessing modules with NuxtJS) at the bottom of this document: https://github.com/championswimmer/vuex-module-decorators/blob/master/README.md

I've searched for the solution for almost 3 days and tried out this link: vuex not loading module decorated with vuex-module-decorators but, it didn't work. Also, I used getModule directly in the component like the solution in this issue page: https://github.com/championswimmer/vuex-module-decorators/issues/80

import CounterModule from '../store/modules/test_module';
import { getModule } from 'vuex-module-decorators';
let counterModule: CounterModule;

Then

created() {
        counterModule = getModule(CounterModule, this.$store);
}

Then, accessing method elsewhere

computed: {
        counter() {
            return counterModule.getCount
        }
    }

it didn't work for me!

This is my Module in store folder in Nuxtjs project:

import { ICurrentUser } from '~/models/ICurrentUser'
import { Module, VuexModule, Mutation, MutationAction } from 'vuex-module-decorators'

@Module({ stateFactory: true, namespaced: true, name: 'CurrentUserStore' })
export default class CurrentUser extends VuexModule {
    user: ICurrentUser = {
        DisplayName: null,
        UserId: null,
    };

    @Mutation
    setUser(userInfo: ICurrentUser) {
        this.user = userInfo;
    }

    get userInfo() {
        return this.user;
    }
}

In index.ts file in sore folder:

import { Store } from 'vuex'
import { getModule } from 'vuex-module-decorators'
import CurrentUser from './currentUser'

let currentUserStore: CurrentUser

const initializer = (store: Store<any>): void => {
  debugger
  currentUserStore = getModule(CurrentUser, store)
}

export const plugins = [initializer]
export {
  currentUserStore,
}

I think the problem stems from this line:

currentUserStore = getModule(CurrentUser, store)

currentUserStore is created as object but properties and methods are not recognizable.

when I want to use getters or mutation I get error. For instance, "unknown mutation type" for using mutation

Answer 1

相同的问题:-(看起来还没有准备好使用。

Answer 2

Probably several months late but I struggled with a similar issue, and eventually found the solution in https://github.com/championswimmer/vuex-module-decorators/issues/179

It talks about multiple requirements (which are summarised elsewhere )

The one that relates to this issue is that the file name of the module has to match the name you specify in the @Module definition.

In your case, if you rename your file from currentUser to CurrentUserStore' or change the name of the module to CurrentUser`, it should fix the issue.