programing

다른 Vuex 모듈에서 변환 커밋

projobs 2023. 1. 24. 09:52
반응형

다른 Vuex 모듈에서 변환 커밋

다음과 같은 구조를 가지고 있습니다.

store.js
|
|-- yields.js
|
|--analysis (sub-folder)
          |
          |
          ---actions.js
          |
          ---mutations.js
          |
          ---state.js

morties.js에서 다음과 같이 state.js 상태의 날짜를 설정합니다.

stateFetchParamsStart: (state, input) => {
  state.fetchParams.start = input;
  // Want to change yields.PRdate too
  //state.yields.PRdate = input;
}

state.js로부터의 변환을 사용하여 prdate state state에 접속하려면 어떻게 해야 합니까?


자세한 내용은 편집:

초기값을 설정하고 있습니다.PRdate구성 요소가 다음과 같이 장착되어 있는 경우:

mounted(){
  ...
  this.fetchPRData(this.pvSystem.system_id); // makes an axios call
}

또한 날짜를 묻는 계산 속성을 설정했습니다.

getPrDate: {
  get(){
    return this.$store.state.yields.PRdate;
  }
}

이제 달력 보기를 클릭할 때 날짜를 변경하고자 합니다(또한 날짜의 계산된 속성).v-model):

start: {
  get() {
    return this.$store.state.analysis.fetchParams.start
  },
  set(value) {
    this.$store.commit('stateFetchParamsStart', value)
  }
}

Vuex 모듈의 상태를 다른 모듈에서 변경할 수 있지만 작업을 통해 변경해야 합니다.이 액션에 의해 다른 모듈의 변환이 호출될 수 있습니다.먼저 수율 모듈에 변환을 작성합니다.

mutations: {
  statePRdate(state, input) {
    state.PRdate = input;
  }
}

이제 분석 모듈의 액션을 사용하여 변환을 커밋할 수 있습니다.세 번째 인수를 에 전달합니다.commit호출:

{ root: true }

첫 번째 인수는 mutationName 또는 moduleName/mutationName(모듈 이름/mutationName)입니다.다음으로 자체 모듈의 변환과 다른 모듈의 변환을 모두 호출하는 새로운 액션을 나타냅니다.

actions: {
  analysisAction({ commit }, input) {
    commit('stateFetchParamsStart', input);         // Commit in this module
    commit('statePRdate', input, { root: true });   // Commit in another module
  }
}

다음과 같은 작업을 시작합니다.

this.$store.dispatch('analysisAction', 'input')

모듈 이름 지정

모듈이 네임슬레이징 되어 있는 경우 커밋과 액션 모두에 네임슬레이드 구문을 사용합니다.

commit('yields/statePRdate', input, { root: true })
this.$store.dispatch('analysis/analysisAction', 'input')

언급URL : https://stackoverflow.com/questions/65918720/commit-mutation-in-a-different-vuex-module

반응형