Vue: Vuex getter에서 데이터가 변경되지 않았습니까?

Vue: Vuex getter에서 데이터가 변경되지 않았습니까?

다른 컴포넌트가 변이되었을 때 트리거된 모달컴포넌트가 있습니다triggerModalState제 Vuex 스토어에 게터라는 사람이 있어요getFulfillmentModalState모달은 로컬 데이터 필드인dialoggetter의 값으로 설정했습니다.this.$store.getters.getFulfillmentModalState나는 의 가치를 확인하고 있다.this.$store.getters.getFulfillmentModalState,그리고 그것은 그렇다.true내가 모달의 트리거를 한 후에, 하지만dialog데이터는 여전히 거짓입니다.내가 여기서 뭘 잘못하고 있는 거지?

<template>
    <div class="fulfillment-modal-component">
        <v-row justify="center">
            <v-dialog v-model="dialog" persistent max-width="290">
                <v-card>
                    <v-card-actions>
                        <v-spacer></v-spacer>
                        <v-btn color="rgba(53, 87, 151, 0.85)" text @click="changeModalState(true)">Cancel</v-btn>
                        <v-btn color="rgba(53, 87, 151, 0.85)" text @click="changeModalState(false)">Continue</v-btn>
                    </v-card-actions>
                </v-card>
            </v-dialog>
        </v-row>
    </div>
</template>

<script>
    import {mapState} from 'vuex';
    import store from './../../store/store';

    export default {
        name: 'fulfillment-modal',

        mounted() {

        },

        data() {
            return {
                dialog: this.$store.getters.getFulfillmentModalState
            }
        },
    }
</script>

dialog이 경우 반응하지 않습니다. 왜냐하면 이 경우는data()이동dialog반응하게 만드는 방법:

//...
export default {
  data() {
    return {
      //dialog: /*..*/   // move to computed
    }
  },
  computed: {
    dialog() {
      return this.$store.getters.getFulfillmentModalState
    }
  }
}

데모

언급URL : https://stackoverflow.com/questions/60312189/vue-data-is-not-changing-with-vuex-getter