Vuex动作调度问题与电子答案

【问题标题】：Vuex action dispatch problem with electronVuex动作调度问题与电子
【发布时间】：2019-05-13 20:32:45
【问题描述】：

我有带有 vuex 的电子应用程序。商店为整个应用程序配置了模块，我的测试模块 Browser.js：

export default {
  namespaced: true,
  state: {
    currentPath: 'notSet'
  },
  mutations: {
    setPath (state) {
      state.currentPath = 'xxxx'
    }
  },
  actions: {
    updateCurrentPath ({ commit }) {
      console.log('COMMIT')
      commit('setPath')
    }
  },
  getters: {
    getCurrentPath (state) {
      return state.currentPath
    }
  }
}

现在在组件内部我试图发送更新操作但没有成功。吸气剂工作正常：

mounted () {
  console.log('mounted')
  console.log('# GET FROM STORE:', this.$store.getters['Browser/getCurrentPath'])
  console.log('# DISPATCH:', this.$store.dispatch('Browser/updateCurrentPath'))
  console.log('# GET FROM STORE 2:', this.$store.getters['Browser/getCurrentPath'])
},

控制台：

mounted
Browser.vue?31a5:62 # GET FROM STORE: notSet
Browser.vue?31a5:63 # DISPATCH: undefined
Browser.vue?31a5:64 # GET FROM STORE 2: notSet

动作存在，当我记录 this.$store 变量时，我可以看到：

Store {_committing: false, _actions: {…}, _actionSubscribers: Array(0), _mutations: {…}, _wrappedGetters: {…}, …}
_actions:
Browser/updateCurrentPath

那么我应该如何调度操作呢？

【问题讨论】：

标签： javascript vue.js electron vuex vuex-modules

【解决方案1】：

问题出在电子插件上。我正在使用来自 github 的 electron-vue repo，并且使用了一个插件：

export default new Vuex.Store({
  modules,
  plugins: [
    createPersistedState(),
    createSharedMutations()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

createSharedMutations 插件是问题所在。注释掉后，一切正常：

export default new Vuex.Store({
  modules,
  plugins: [
    createPersistedState()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

【讨论】：

我在这上面花了几个小时！
我也是 :) 我很高兴能帮上忙
该死的你拯救了我的一天

【解决方案2】：

如果你启用了 createSharedMutations() 插件，你需要在主进程中创建一个 store 实例。为此，只需将此行添加到您的主进程中（例如 src/main.js）：

import './path/to/your/store'link to official plug used by electron-vue which is causing this issue

【讨论】：

【解决方案3】：

如果您使用带有 vuex-electron 插件的 vue-electron 模板，您需要在 src/main/index.js 文件中添加以下行

import store from '../renderer/store'

【讨论】：

拯救了我的夜晚！