Vuex报错之[vuex] unknown mutation type: handlePower问题及解决
更新时间：2023年07月04日 10:01:24 作者：碎碎。
这篇文章主要介绍了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里面的内容如下：
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue-pdf如何通过文件流预览pdf文件问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
在Vue3中,页面访问拦截（Navigation Guards）是一种常见的路由控制机制,那么Vue3具体是如何实现这一功能的呢,下面就跟随小编一起来学习一下吧2024-03-03
在Vue中使用`el-switch`组件时,绑定数值类型时应使用布尔值（true/false）,而绑定字符串类型时应使用字符串（'true'/'false'）2024-12-12
这篇文章主要为大家详细介绍了Vue.js第三天的学习笔记，vue.js计算属性computed,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
Vue的生命周期就是vue实例从创建到销毁的全过程,也就是new Vue() 开始就是vue生命周期的开始。Vue 实例有⼀个完整的⽣命周期,也就是从开始创建、初始化数据、编译模版、挂载Dom -> 渲染、更新 -> 渲染、卸载 等⼀系列过程,称这是Vue的⽣命周期2022-08-08
本文主要介绍了mini-vue渲染的简易实现，主要简单来实现一个虚拟dom渲染真实dom，以及更新的方法。具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
这篇文章主要介绍了vue 通过下拉框组件学习vue中的父子通讯的相关知识,文中涉及到了父组件，子组件的实现代码，需要的朋友可以参考下2017-12-12
这篇文章主要为大家介绍了vue前端实现打印下载示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-08-08
这篇文章主要介绍了Vue重试机制示例，重试指的是当加载出错时，有能力重新发起加载组件的请求。异步组件加载失败后的重试机制，与请求服务端接口失败后的重试机制一样2023-01-01
antd vue中,如何在form表单中的自定义组件使用v-decorator
antd vue中,在form表单中的自定义组件使用v-decorator问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-04-04
最新评论