Programing

vuex에서 {dispatch, commit }에 대한 유형은?

c10106 2022. 5. 22. 11:03
반응형

vuex에서 {dispatch, commit }에 대한 유형은?

나는 뷔제스 타입스크립트 프로젝트를 받았고 vuex 매장에서 다음과 같은 것을 받았다.

async getUserProfile ({ dispatch, commit }: any) {}

음 나는 원하지 않는다.any왜냐하면 그것은 형편없고 당신은 편집자의 도움/완료력이 없기 때문이다.나는 이걸 발견했어.import { Dispatch, Commit } from "vuex";하지만 어떻게 하면 그 정보를{ dispatch, commit }: any

당신이 사용하는 것은ActionContext<S, R>, Vuex가 하는 것처럼:

getUserProfile( context: ActionContext<S, R>) {}

어디에S이다State그리고R이다RootState.

그럼 네가 전화해라.dispatch그리고commit문맥에서 벗어난:

 context.dispatch('action')
 context.commit('mutation')

다음 파일에서 사용 가능한 vuex 유형을 확인하십시오.

node_modules/vuex/types/index.d.ts

// 라인 49 :

export interface Commit {
  (type: string, payload?: any, options?: CommitOptions): void;
  <P extends Payload>(payloadWithType: P, options?: CommitOptions): void;
}

다음과 같이 ActionContext 대신 이를 가져와서 사용할 수 있다.

import { Commit } from 'vuex';

const actions = {
    loadUser ({ commit }: { commit: Commit }, user: any) {
        commit('setUser', user);
    },

    ...
};

도움이 되기를 바라며 :)

원한다면 컨텍스트 객체를 파괴할 수 있다.

import { ActionContext } from 'vuex';
import { RootState } from './types';

const actions = {
    // destructured
    loadUser ({ commit }: ActionContext<RootState, RootState>, user: any) {
        commit('setUser', user);
    },

    // not destructured
    loadUser (context: ActionContext<RootState, RootState>, user: any) {
        context.commit('setUser', user);
    },
};

vuex에서 Commit type을 가져오면 된다.

import { Commit } from "vuex";

다음과 같은 작업에 사용:

changeNumber({ commit }: { commit: Commit }, new_number: number) {
  commit("setNewNumber", new_number);
}

참조URL: https://stackoverflow.com/questions/50375281/what-are-the-types-for-dispatch-commit-in-vuex

반응형