动态和命名空间模块未注册(vuex-module-decorators,vuex-class)

问题描述 投票:0回答:1

该模块未注册:

$nuxt.$store._modulesNamespaceMap // No properties

另外,我收到这个警告:

Classic mode for store/ is deprecated and will be removed in Nuxt 3.

我尝试过的:

  1. 手动加载模块以查看命名空间是否正常工作(FAIL)。
  2. 尝试不使用命名空间来动态加载模块(FAIL)。

码:

// @/store/modules/User.ts
import { Module, VuexModule, Mutation, Action } from "vuex-module-decorators";
import { firebase, auth, GoogleProvider, StoreDB } from "@/services/fireinit";
import { IUser } from "~/types/user";
import { store } from "..";

// It seems like the "store" is messed somehow
@Module({ dynamic: true, namespaced: true, store: store, name: "user" })
export default class User extends VuexModule {
  user: IUser = null;

  @Action
  async autoSignIn(user: IUser) {
    this.context.commit("setUser", user);
  }

  @Action
  async signInWithGoogle() {
    return new Promise(resolve => {
      console.log("signInWithGoogle:", this);
      auth.signInWithRedirect(GoogleProvider);
      resolve();
    });
  }

  // trunked ...
}
// @/store/index.ts
import Vuex, { Store } from "vuex";
import User from "./modules/User";

// trunked ...

// Declare empty store first
export const store = new Vuex.Store<IStoreType>({});

const createStore = () => store;

export default createStore;
// @/pages/login.vue

// trunked ...

const User = namespace('user'); // [vuex] module namespace not found in mapActions(): user/

@Component({})
export default class LoginComponent extends Vue {
  @User.State("activeUser") stateUser;
  @User.Action("signInWithGoogle") actionSignInWithGoogle;
}

树:

├── pages
│   └── login.vue
├── store
│   ├── index.ts
│   └── modules
│       └── User.ts

我希望能够加载动态和命名空间的模块......

我尝试了在万维网上找到的所有东西,但我无法让它发挥作用。

我做错了什么?

vue.js vuex nuxt.js vuex-modules
1个回答
0
投票

好的,我发现了一种有效的方法......

码:

// @/store/index.ts
import Vuex, { Store } from "vuex";
import User from "./modules/User";

// trunked ...

// Declare empty store first
export const store = new Vuex.Store<IStoreType>({});
// No more "createStore" shit.
// @/pages/login.vue

// trunked ...

const User = namespace('modules/User/'); // "modules/" is important to make it work.

@Component({})
export default class LoginComponent extends Vue {
  @User.State("activeUser") stateUser;
  @User.Action("signInWithGoogle") actionSignInWithGoogle;
}
© www.soinside.com 2019 - 2024. All rights reserved.