programing

vuex + typescript + 네임스페이스 모듈: 다른 모듈 상태 액세스

muds 2023. 7. 15. 10:41
반응형

vuex + typescript + 네임스페이스 모듈: 다른 모듈 상태 액세스

저는 vuex를 typescript 및 네임스페이스 모듈과 함께 사용하고 있습니다.저는 "사용자 프로파일"과 "트립"이라는 두 개의 모듈이 있습니다.모든 것이 하나의 모듈 안에서 작동합니다.

"Trip" 모듈 내부에서 "UserProfile" 모듈 상태에 저장된 현재 사용자에 액세스해야 합니다.

제가 알기로는 cipt 형식을 사용하지 않으면 rootState["profile/user"]를 사용할 수 있습니다.

그러나 typescript에서는 컴파일러가 다음과 같은 오류를 표시합니다.

Element implicitly has an 'any' type because type 'RootState' has no index signature.

다음은 "트립" 모듈에서 수행한 작업입니다.

async createTrip({ commit, state, rootState, rootGetters}) {
    const user = rootState["profile/user"];
}

vuex + typescript를 사용할 때 다른 네임스페이스 모듈이 소유한 상태에 액세스하는 올바른 방법을 아는 사람?

감사해요.

업데이트 =====

현재 제가 찾은 유일한 해결책은 다음과 같습니다.

전체 상태를 반환하는 게터를 생성하는 각 모듈에 대해(즉, "프로파일" 모듈이 반환하는 게터 프로파일 상태 유형을 추가함)

root을 통해 getter를 사용하는 다른 모듈에서 다음과 같이 Getter를 사용합니다.

 async createTrip({ commit, state, rootState, rootGetters}) {
    const profileState: ProfileState= rootGetters["profile/getState"];
    if(profileState.user === undefined ) return;
    console.log("CurrentUser: " + profileState.user.uid);
}

그러나 typescript에서는 컴파일러가 다음과 같은 오류를 표시합니다.

Element implicitly has an 'any' type because type 'RootState' has no index signature.

이 오류는 형식 선언에서 정의를 추가하지 못했음을 나타냅니다.

예:

export type RootState = {
  //...
  profile?: ProfileState
}

또는

export type RootState = {
  //...
  [k in keyof ModuleStateTypes]?: ModuleStateTypes[k] 
}

매핑된 유형

아이디어입니다. 단순히 rootState typedef에 모듈을 추가할 수 없습니까?이와 같이:

{ ...; moduleName?: moduleState;}

또는 심지어:

{ ...; [key: string | number]: any;}

언급URL : https://stackoverflow.com/questions/52863826/vuex-typescript-namespace-modules-accessing-other-module-state

반응형