Vuex 모듈의 형식 오류 "표현으로 호출될 때 클래스 장식가의 서명을 확인할 수 없음"

Vuex 모듈의 형식 오류 "표현으로 호출될 때 클래스 장식가의 서명을 확인할 수 없음"

라이브러리에서 내보내는 Typecript를 사용하는 다음 Vuex 모듈이 있음:

import * as types from '@/store/types';
import {Formio} from 'formiojs';
import { VuexModule, Module, Mutation, Action } from 'vuex-module-decorators'

interface RoleItem {
  _id: string;
  title: String;
  admin: Boolean;
  default: Boolean;
}

interface RoleList {
  [key: string]: RoleItem;
}

export class Auth extends VuexModule {
  public user: {}
  public loggedIn: boolean
  public roles: {}
  public forms: {}
  public userRoles: {}

  @Action
  setUser({ state, commit, dispatch }, user) {
    commit(types.SET_USER, user);
    dispatch('setLoggedIn', true);
    dispatch('setUserRoles', state.roles);
  }
  @Action
  setLoggedIn({commit}, loggedIn) {
    commit(types.SET_LOGGED_IN, loggedIn);
  }
  @Action
  getAccess({ commit, dispatch, getters }) {
    const projectUrl = Formio.getProjectUrl();
    Formio.request(projectUrl + '/access')
      .then(function(accessItems) {
        commit(types.SET_ROLES, accessItems.roles);
        commit(types.SET_FORMS, accessItems.forms);
        if (getters.getLoggedIn) {
          dispatch('setUserRoles', accessItems.roles);
        }
    });
  }
  @Action
  setUserRoles({ commit, getters }, roles: RoleList) {
    const roleEntries = Object.entries(roles);
    const userRoles = getters.getUser.roles;
    const newRolesObj = {};
    roleEntries.forEach((role) => {
      const roleData = role[1];
      const key = 'is' + role[1].title.replace(/\s/g, '');
      newRolesObj[key] = !!userRoles.some(ur => roleData._id === ur);
    });
    commit(types.SET_USER_ROLES, newRolesObj);
  }

  @Mutation
  [types.SET_USER](user) {
    this.user = user;
  }
  @Mutation
  [types.SET_LOGGED_IN](loggedIn: boolean) {
    this.loggedIn = loggedIn;
  }
  @Mutation
  [types.SET_ROLES](roles: RoleList) {
    this.roles = roles;
  }
  @Mutation
  [types.SET_FORMS](forms) {
    this.forms = forms;
  }
  @Mutation
  [types.SET_USER_ROLES](userRoles) {
    this.userRoles = userRoles;
  }
}

export default Auth;

단순히 상위 Vue 앱에서 이름을 능가하는 Vuex 모듈로 가져와 내 스토어에 새 모듈로 추가하고 싶다.

import Vue from 'vue';
import Vuex from 'vuex';
import { Auth } from 'vue-formio'

Vue.use(Vuex);

...

resourceModules.auth = Auth;

export default new Vuex.Store({
  modules: resourceModules,
  strict: debug,
});

그 부분은 모두 잘 된다.문제는 설정이다.namespaced: true그리고name :auth내보낸 저장소의 속성.내가 읽은 바에 의하면, 나는 그 일을 할 수 있어야 한다.@Module다음과 같은 장식가:

@Module({ namespaced: true, name: 'auth' })
export class Auth extends VuexModule {

그러나, 그 뒤에 괄호를 붙이자 마자.@Module실내 장식가, IDE에서 TS 오류가 발생함:

TS1238: 표현으로 호출될 때 클래스 장식가의 서명을 확인할 수 없음.유형에 호출 서명이 없는 식을 호출할 수 없음.'void' 형식에 호환되는 통화 서명이 없음.

Vuex-모듈 디코더 코드에서 볼 수 있듯이 다음과 같은 옵션이 허용된다.

export interface StaticModuleOptions {
  /**
   * name of module, if being namespaced
   */
  name?: string;
  /**
   * whether or not the module is namespaced
   */
  namespaced?: boolean;
  /**
   * Whether to generate a plain state object, or a state factory for the module
   */
  stateFactory?: boolean;
}

이건 내가 Typecript에 처음 간 거라서 당황스럽다.아직 조사 중이지만, 그 동안 Typecript를 사용하여 이 Vuex 모듈에 이름표시를 어떻게 추가해야 할까?

내가 알아낸 빠른 해결책은 추가하기 위해서였다.

'vuex-module-decorator/dist/type/moduleoptions'에서 {ModuleOptions } 가져오기;

@Module({dynamic: true, name: 'user', name upted: true, store: store } as ModuleOptions)

구성 개체로 이동하십시오.

그 오류는 당신이 전화했기 때문이다.@Actionparams와 함께 그것은 이해하지 못한다.여기 문서들.

아마 사용하면서 가장 혼란스러운 부분일 것이다.vuex-module-operators일반 Vuex와는 달리, 첫 번째 파라미터(ActionContext)는@Actions를 건너뛰다로 이용할 수 있다.this.context.

이 패키지에서 작업 중 하나를 수행하는 방법은 다음과 같다.

@/store/auth.ts

import { ActionContext } from 'vuex';
import { Module, VuexModule, Action } from 'vuex-module-decorators';
import * as types from './types';
import store from '.';

@Module({ namespaced: true, store, name: 'auth' })
export default class AuthStore extends VuexModule {

  @Action
  async setUser(user) {
    const { state, commit, dispatch } = this.context;
    commit(types.SET_USER, user);
    dispatch('setLoggedIn', true);
    dispatch('setUserRoles', state.roles); // could be `this.roles`
  }
}

전화도 꼭 하고getModule(Auth, store)저장소를 만든 후 기본 저장소 파일에 저장하십시오.나는 이 전화는 유형을 유추하는 것 외에 다른 효과는 없다고 믿는다.(그 가게는 그것 없이 잘 작동하는 것처럼 보이지만, Typecript는 더 이상 작동하지 않는다.)예:

@/store/index.ts

import Vue from 'vue';
import Vuex from 'vuex';
import Auth from './auth';
import { getModule } from 'vuex-module-decorators';

Vue.use(Vuex);

const store = new Vuex.Store({
  //...
  modules: {
    auth: Auth
  }
});

getModule(Auth, store);

export default store;

---

참고로 왜 파견을 하는지 이해가 안 된다.setUserRoles와 함께state.roles-state다음에서 사용 가능setUserRoles에서 이용할 수 있는 것과 같은 행동setUser작업을 수행하므로 역할을 매개 변수로 보낼 필요가 없음.
진심이었어?dispatch('setUserRoles', user.roles);?

참조URL: https://stackoverflow.com/questions/61926111/typescript-error-unable-to-resolve-signature-of-class-decorator-when-called-as