source

vuex-module-decorator에서 MutationAction을 사용하는 방법

gigabyte 2022. 8. 21. 19:49
반응형

vuex-module-decorator에서 MutationAction을 사용하는 방법

https://championswimmer.in/vuex-module-decorators의 vuex-variators를 사용하려고 합니다.모듈 상태에 프로펠러가 있다고 칩시다.dir그건 명령이다.{[key: string]: string}사용할 수 있습니까?@MutationAction그 명령의 요소를 업데이트 할 수 있나요?아래 코드는 맞지 않지만 내 뜻을 이해하기를 바란다.

export default class Module extends VuexModule {
  dir: {[key: string]: string}

  @MutationAction(???)
  updateDir(keyValue) {
    return keyValue // ???
  }
}

사용 방법에 대한 문서가 있습니까?@MutationAction어떤 arg가 필요하며 실제로 어떤 변환을 커밋합니까?

당신이 해야 할 일은 다음과 같습니다.

export default class Module extends VuexModule {
  dir: {[key: string]: string}

  @MutationAction(['dir'])
  async updateDir(keyValue) {
    const currDir = this.dir

    // do any async work (network req) here
    currDir['myKey'] = keyValue

    return ( { dir: currDir } )
  }
}

그러나 애초에 비동기 작업이 필요하지 않은 경우.

export default class Module extends VuexModule {
  dir: {[key: string]: string}

  @Mutation
  async updateDir(keyValue) {
    this.dir.myKey = keyValue
  }
}

P.S. 나는 의 저자이다.vuex-module-decorators

저는 Vuex를 처음 접하는 사람입니다.어쨌든, 다음과 같이 정리합니다.

export class MyModule extends VuexModule {

    public dir: { [key: string]: string } = {};

    @MutationAction({ mutate: ['dir'] })
    public async updateDir(key: string, value: string) {
        const newDir: { [key: string]: string } = {};
        newDir[key] = value;
        return {
            dir: newDir,
        };
    }

    @MutationAction({ mutate: ['dir'] })
    public async addToDir(key: string, value: string) {
        this.dir[key] = value;
        return {
            dir: this.dir,
        };
    }
}

두 번째 기능에서처럼 'dir' 변수를 수정 및 재할당해도 되는지 알 수 없습니다.

언급URL : https://stackoverflow.com/questions/55730545/how-to-use-mutationaction-in-vuex-module-decorators

반응형