一、问题描述

在electron-vue中使用vuex，调用this.$store.dispatch("changeLogin");时，无法修改登录状态，调试了很久都没有看出问题在哪边。

store代码

const state = {
  isLogin: false
}

const getters = {
  isLogin(state) {
    return state.isLogin
  }
}

const mutations = {
  changeLogin(state) {
    state.isLogin = true
  }
}

const actions = {
  changeLogin(context) {
    context.commit("changeLogin")
  }
}

export default {
  state,
  getters,
  mutations,
  actions
}

调用修改状态的方法

console.log(this.$store.getters.isLogin);
console.log(this.$store);
this.$store.dispatch("changeLogin");
console.log(this.$store.getters.isLogin);

输出结果

isLogin初始是false，调用this.$store.dispatch("changeLogin");后输出结果还是false。

控制台输出结果.png

二、解决方法

在GitHub的issue里搜了下，没有发现类似的问题，最后实在没办法，我就在segmentfault上提了这个问题，问题链接。
得到的回答是 src/renderer/store/index.js中引用了createSharedMutations插件，在注释掉这个插件后，果然可以改变状态了。

import Vue from 'vue'
import Vuex from 'vuex'

import { createPersistedState, createSharedMutations } from 'vuex-electron'

import modules from './modules'

Vue.use(Vuex)

export default new Vuex.Store({
  modules,
  plugins: [
    createPersistedState(),
    // 注释这个插件的调用 
    //createSharedMutations()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

问题是解决了，但还是不了解引起这个问题具体的原因，这个插件是用于多窗口共享状态的，去掉后应该会影响多窗口的传值，或许有其他的解决方案。

问题留待继续跟踪