VueX 상태에서 값을 직접 설정하는 방법

VueX 상태에서 값을 직접 설정하는 방법

나는 단지 VueX 상태에서 동작 > 돌연변이 > 상태를 따라가는 단계를 통해 데이터를 변경하고 다른 구성 요소의 VueX 상태에서 데이터를 가져오기를 원한다. 할 수 있는가? 아니면 누구든 어레이로 값을 ...mapAction으로 보낼 수 있는 다른 최선의 방법이 있는가?

사실, 나는 단지 어레이와 함께 데이터를 다른 컴포넌트로 보내고 싶어. 다른 컴포넌트는 내가 사용했던 Treevue 컴포넌트의 체크박스를 사용자가 선택할 때마다 데이터가 변경될 거야.

정말 고마워.

## FilterList.vue ##
export default {
  data() {
    return {
      listSelected: ['aa','bb','cc','...'],  // this value will mutate when user has selected checkbox
    }
  }
}

=================================================================
## store.js ##
export default new Vuex.Store({
  state = {
    dataSelected: [ ]
  },
  mutation = {
    FILTERSELECTED(state, payload) {
      state.selected = payload
    }
  },
  action = {
    hasSelected(context,param) {
      context.commit('FILTERSELECTED',param)
    }
  },
  getters = {
    getSelected: state => state.dataSelected,
  }
  
  strict: true
})

설정할 수 있다strict: false직접 자료를 바꾸는 것도 좋지만 추천하고 싶진 않아
당신은 Vuex가 제공하는 혜택을 잃게 될 것이다. 나는 차라리 그 개체를 Vuex 밖에서 공유하겠다.

모든 변화가 스토어와 동기화될 필요는 없고 시나리오에 따라 달라진다.
EditUser 구성 요소의 경우 스토어에서 사용자 개체의 세부 복사본으로 시작:

this.tmpUser = JSON.parse(JSON.stringify(this.$store.state.user))

이 tmpUser는 스토어에서 연결이 끊겨 속성을 변경할 때 경고(또는 업데이트)를 생성하지 않는다.
사용자가 "저장" 버튼을 누르면 변경된 개체를 다시 저장소로 보내겠다.

this.$store.dispatch("user/save", this.tmpUser)

저장소의 인스턴스를 업데이트하고 응용 프로그램의 다른 부분에서 변경 내용을 볼 수 있도록 허용.

나도 비동기(데이터 가져오기/저장)가 필요할 때만 작업을 쓴다.동기화 작업의 경우 변경 사항과 사용 내용만 기록하며mapMutations도우미 또는 호출$store.commit("mutation")단도직접의

참조URL: https://stackoverflow.com/questions/53005615/how-can-i-directly-set-value-in-state-of-vuex