javascript - Vuex Store在Typescript类中未定义

我有一个问题，我想将Typescript类引用到我的Vuex商店。但是商店总是不确定的。

这是我的商店

import Vue from 'vue';
import Vuex from 'vuex';
import { SessionManager } from '@/classes/worker';
import { User } from '@/classes/user';

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    user : new User(),
    store : new SessionManager(),
  },
  mutations: {

  },
  actions: {

  },
  getters:{
    getUser : state => {
      return state.user;
    }
  },
});

在我的SessionManager类中，我想在构造函数中做类似的事情

import  store from '@/store';

        export class SessionManager {

        public constructor() {

            let user = store.state.user as User;
            console.log(store);

        }
    }

我有适用于Chrome的Vue扩展程序。因此，当我在使用商店之前在该行的Chrome中设置断点时，并在扩展中观察商店的状态，他已经存在。

有人能帮我吗？

最佳答案

似乎您具有循环依赖性：您的商店文件在调用new SessionManager()之前先调用new Vuex.Store，因此，当SessionManager构造函数运行时，尚未创建和导出商店。我猜您应该避免从SessionManager构造函数访问存储。我不了解Vuex，所以可能还有另一种方法可以做到。

要了解发生了什么，让我们看一下代码的简化版本：

let store;
class SessionManager {
    constructor() {
        console.log(store);
    }
}
let sm = new SessionManager();
store = new Vuex.Store({state: {store: sm, ...}, ...});

在运行new SessionManager()时，store尚未初始化，因此它是undefined。

关于javascript - Vuex Store在Typescript类中未定义，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51891865/