Vuex报错之[vuex] unknown mutation type: handlePower问题及解决

vuex报错[vuex] unknown mutation type: handlePower

报错截图

相关代码

 //--------------------- store.js -----------------
 ...
const mutation = {
  handlePower: (state, power) => {
    state.power = power
    localStorage.setItem('power', power)
  }
}
const store = new Vuex.Store({
  ...
  mutation
})
  //--------------------- login.vue -----------------
  this.$store.commit('handlePower', res.data.data)
    //--------------------- 在nav.vue中获取 -----------------
  console.log(this.$store.getters.power)

原因（想给自己一个嘴巴子那种）

在vuex中没有mutation，有的是mutations，把上面的mutation修改为mutations即可

ps： vuex中除了state其它都是复数

vue组件使用vuex中的mutations方法报错，报unknown mutation type的错误

报错：【vuex】 unknown mutation type: mutation

vuex如果分为几个模块，方法是在某个模块中的话，如果直接在组件中通过this.$store.commit('方法名')是获取不到的，必须要在前面加上模块名，如this.$store.commit('模块名/方法名')才可以获取到。

在项目当中，我当前组件的vuex写在store/DataMonitorStore/DataMonitorStore.js里的，所以这里必须加上模块名。

当前组件是sliderBar.vue页，我需要在这个页面把数据存到vuex里面

使用this.$store.commit()方法进行存储

当着组件是yearQueryContent.vue页，我需要在这个页面获取之前存储到vuex里的数据

使用this.$store.state.DataMonitorStore.value进行获取，同时注意这里的DataMonitorStore也是

模块名，一开始我在获取时没有写模块名，导致取出的数据一直是undefined。

 同时在该组件中还需要用到watch监听事件，去监听values是否有变化，若变化 则修改对应的src值。

vuex里面的内容如下：

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。