VueX 突变有效，但组件计算属性无效

Question

我已经阅读了很多关于这个问题的问答，但我似乎没有做任何前面描述的问题。

我已经开始为我的状态使用模块，但是在设置好所有内容之后，我可以看到商店模块的本地状态和 getter 都得到了更新。但是计算出的属性没有。我不知道为什么会这样，所以我在这里寻求帮助。

index.js

import Vue from 'vue'
import Vuex from 'vuex'
import base_states from './modules/base_states'
import dialogs from './modules/dialogs'

Vue.use(Vuex)

export default new Vuex.Store({
  modules: {
    base_states,
    dialogs,
  },
})

dialogs.js

// initial state
const state = {
  signInModalDialogComponent: 'signOn',
  attendanceModalDialogComponent: 'AttendanceDetails',
  dialogSignInVisible: false,
  dialogDonationVisible: false,
}

// getters
const getters = {
  signInModalDialogComponent: state => state.signInModalDialogComponent,
  attendanceModalDialogComponent: state => state.attendanceModalDialogComponent,
  dialogSignInVisible: state => state.dialogSignInVisible,
  dialogDonationVisible: state => state.dialogDonationVisible,
}

// actions
const actions = {}

// mutations
const mutations = {
  changeComponent(state, data){
    state.signInModalDialogComponent = data
  },
  changeAttendanceComponent(state, componentName){
    state.attendanceModalDialogComponent = componentName
  },
  toggleSignInVisibility(state, data){
    state.dialogSignInVisible = data
  },
  changeDonationVisibility(state, data){
    state.dialogDonationVisible = data
  },
}

export default {
  state,
  getters,
  actions,
  mutations
}

组件（我拿出了一堆代码，不相关）

<template lang="pug">
...
    el-dialog(width='300px', :visible.sync='dialogSignInVisible')
      component(
        :is='signInModalDialogComponent',
        @componentchanged='dialogComponent = $event'
      )
</template>

<script type="text/javascript">
  import { mapGetters, mapMutations } from 'vuex';
  export default {
    computed: {
      ...mapGetters([
        'dialogSignInVisible',
        'signInModalDialogComponent',
      ]),
    },
    methods: {
      ...mapMutations([
        'toggleSignInVisibility'
      ]),
    }
  }
</script>

具体来说，我正在查看 dialogSignInVisible，它没有改变。正如您从开发工具中看到的那样，突变会发生并改变本地状态和 getter。但是当我查看组件时，计算的 vuex 绑定没有改变。

Answer 1

问题是我在我的商店和我的 webpack 包中使用不同的 Vue 可执行文件。

我到处都用import Vue from 'vue/dist/vue.esm'，但在store我用import Vue from 'vue'。确保它们相同后，一切正常。

VueX 突变有效，但组件计算属性无效

VueX mutation works, but component computed property doesn't

vue.js

vuex

vuex-modules

VueX 突变有效，但组件计算 属性 无效

VueX mutation works, but component computed property doesn't

vue.js

vuex

vuex-modules

VueX 突变有效，但组件计算属性无效