VueJ - Vuex 상태가 업데이트될 때 구성 요소가 업데이트되지 않음

VueJ - Vuex 상태가 업데이트될 때 구성 요소가 업데이트되지 않음

저는 주 내에 "column Choice"라는 아이템이 있는 vuex 스토어를 가지고 있습니다.텍스트 상자에 업데이트 중인 구성 요소와 이를 업데이트하고 양의 정수임을 확인하는 계산된 속성이 있습니다.그러나 vuex 저장소가 확실히 업데이트되고 있음에도 불구하고 컴포넌트의 계산된 속성은 (개발 도구에 따라) 업데이트되지 않습니다.

여기 코드가 있습니다.관련되지 않은 다른 메서드/값은 삭제했습니다만, 뭔가 부족한 것 같으면 알려주세요.

계산된 설정을 "...mapState([]""에서 이 설정으로 변경해 보았으며 별도의 set 및 get 함수를 사용하여 v-model 설정도 시도했습니다.

Vuex 스토어 index.js:

import Vuex from 'vuex'

export default new Vuex.Store({
  state: {
    columnChoice: 1,
    processingStatus: 0,
    columnError: 0
  },
  mutations : {
    resetVars(state) {
      state.processingStatus = 0
      state.columnError = 0
      state.columnChoice = 1
    },

    setProcessingStatus(state, v) {
      state.processingStatus = v
    },

    columnError(state) {
      state.columnError = 1
    },
    columnGood(state) {
      state.columnError = 0
    },
    columnSet(state, v) {
      state.columnChoice = v
    }
  }
})

컴포넌트:

<template>
  <div class="row p-2">
    <div class="col-2">Column in reference file</div>
    <div class="col-10"><input type=text size=3 :value="columnChoice" @change="verifyColumn" id="columnChoice"></div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  name: 'ColumnChoice',
  computed: {
    ...mapState([
      'columnChoice'
    ]),
  },
  methods: {
    verifyColumn(e) {
      if (isNaN(e.target.value) || e.target.value < 1) {
        this.$store.commit('columnError')
        this.$store.commit('columnSet', e.target.value)
      } else {
        this.$store.commit('columnGood')
        this.$store.commit('columnSet', e.target.value)
      }
    },
  }
}
</script>

또한 텍스트 필드에서 값을 5로 변경하고 개발 도구에서 이 컴포넌트를 선택하면($vm0으로 할당), 다음과 같이 상태가 업데이트되고 컴포넌트를 통해 액세스할 수 있지만 계산된 속성은 업데이트되지 않습니다.

$vm0.$store.state.columnChoice
> "5"
$vm0._computedWatchers.columnChoice.value
> "1"

알았어, 내가 알아냈어.내 index.html 파일에서 NPM에서 Import한 vue 인스턴스를 사용하는 것 외에 CDN에서 vue 인스턴스를 가져오고 있었습니다.

언급URL : https://stackoverflow.com/questions/52822692/vuejs-components-not-updating-when-vuex-state-updated