vue使用$store.commit() undefined报错

最新推荐文章于 2024-02-08 15:57:34 发布
最新推荐文章于 2024-02-08 15:57:34 发布
阅读量1.2k 收藏
点赞数
分类专栏： 解决问题 文章标签： uniapp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Da_Xiong000/article/details/125768353
版权

vue使用$store.commit() undefined报错

在项目里打算把设备信息通过$store.commit()保存下来， 发现报错了，后来发现是我们没有在全局中配置store
在这里插入图片描述
在这里插入图片描述

在main.js中引一下，就可以通过this.$store用了

大雄不是大熊
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
在Vue中使用this.$store或者是$route一直报错的解决
10-16
今天小编就为大家分享一篇在Vue中使用this.$store或者是$route一直报错的解决，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vuex中store存储store.commit和store.dispatch的用法
10-15
主要介绍了vuex中store存储store.commit和store.dispatch的用法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
猫头虎分享已解决Bug || TypeError: this.$store.commit is not a function in Vue
最新发布
从前端设计到后端实现，从云技术到人工智能，这里分享最新的技术见解和实践经验。一起学习，一起进步！
02-08 1080
在这篇博客中，我将详细解释这个Bug的原因，并提供一系列解决步骤。准备好跟随我一起深入Vue的世界，解决这个棘手的问题了吗？让我们开始吧！🐾💻问题类型原因解决方案预防措施TypeErrorVuex未正确初始化检查Vuex安装和初始化代码代码审查，确保初始化代码正确TypeError作用域问题使用正确的作用域确保this指向Vue实例在回调中使用箭头函数或其他方法绑定thisTypeError方法名或调用方式错误核对mutation名称和调用方式代码审查和单元测试。
解决vue.js this.$router.push无效的问题
10-18
今天小编就为大家分享一篇解决vue.js this.$router.push无效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
11-20
1、在Vue项目中引用公共方法 作为一个新人小白，在使用vue的过程中，难免会遇到很多的问题，比如某个方法在很多组件中都能用的上，如果在每个组件上都去引用一次的话，会比较麻烦，增加代码量。怎么做比较好呢，话不多说直接看代码把 首先 要在main.js中引入公共js。然后，将方法赋在Vue的原型链上。 像图中这样。 然后在需要的组件上去引入这个方法 mouted (){ //调用方法 this.common.login(); } /**然后公共方法里写一段简单的代码*/ export default{ login:function(){ console.log('这是一段代码') } }
vuex 解决报错this.$store.commit is not a function的方法
10-17
主要介绍了vuex 解决报错this.$store.commit is not a function的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue3 store传值
七月❤的博客
01-11 2220
store传值。
Vue3中vuex的基本使用
weixin_57246557的博客
09-12 1万+
/ useStore()方法创建store对象，相当于src/store/index.js中的store实例对象。拆分后代码如下（src/store/modules/global.js）拆分后代码如下（src/store/modules/user.js）// Vue3中store类似于Vue2中this.$store。// Vue3中store类似于Vue2中this.$store。// 触发mutations，用于同步修改state的信息。拆分后代码如下（src/store/index.js）
已解决 TypeError: this.$store.commit is not a function (Vue)
从前端设计到后端实现，从云技术到人工智能，这里分享最新的技术见解和实践经验。一起学习，一起进步！
09-17 821
嗨，大家好，我是猫头虎博主！今天我要和大家分享一些关于Vue前端开发中遇到的一个令人头疼的Bug：TypeError: this.$store.commit is not a function。在这篇博客中，我将详细解释这个Bug的原因，提供解决方法，并分享如何避免它。让我们一起深入探讨吧！😺在Vue.js前端开发中，出现TypeError: this.storecommitisnotafunction错误可能会令人烦恼。然而，通过正确配置Vuex。
前端学习笔记（15）-Vue3状态管理store及Vuex的使用
JiangZhengyang7的博客
01-31 1万+
1. 状态管理 2.用响应式API做简单状态管理 3.Vuex基础 4.Vuex 核心概念（state getter mutation action module）5.Vuex+sessionStorage实现数据存储
【Vue3学习】Vuex 状态管理 store
不积跬步无以至千里，不积小流无以成江海。一个喜欢学习分享的程序员
06-17 2525
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
vue3 中使用store时这么写可以提升效率
_web_Z的博客
06-01 1011
vue3中store中的数据获取或者设置 写法如下 非常方便
关于this.$store为undefined
m0_51754096的博客
11-10 896
vuex和vue的版本一定要匹配
uni-app小程序（vue3版本）使用Vuex在调用store时报错： Cannot read property ‘state‘ of undefined
TIANJING_er的博客
05-31 1816
通过搜索是因为我开发的uni-app是vue3版本，但是在使用vuex时使用的是2版本的格式所造成的错误。的实例上，这里要注意一定是加到#ifdef VUE3这个位置下面。这里是开发购物车相关的功能时遇到bug报错，如图所示。在页面渲染时，可以直接使用映射过来的数据。文件夹，专门用来存放。目录上鼠标右键，选择。将以上代码修改为如下。目录上鼠标右键，选择。一、首先配置vuex。
vue3中使用useStore()，一直返回undefined
杰克的博客
10-24 4653
vue3中使用useStore()，一直返回undefined
vue3组合式api基础（常用）
jwq
09-14 841
vue3组合式api基础（常用）
Vue3:状态管理-Store(Vuex,Pinia)
热门推荐
weixin_62364503的博客
09-20 1万+
Vue3 状态管理（Vuex，pinia）
解决vue不相关组件传递数据并保存（state），解决报错this.$store.commit is not a function
gang456789的博客
09-12 5936
1。在src文件下创建一个store文件，里面加入一个store.js文件 。内容大致为import vuex from 'vuex' import Vue from 'vue' Vue.use(vuex) export default new vuex.Store({ /*state必须*/ state:{ user:{} }, mutations
如何解决vue报错TypeError: Cannot read properties of undefined (reading '$store')
12-21
在Vue中，当出现"TypeError: Cannot read properties of undefined (reading '$store')"这个错误时，通常是因为没有正确地引入和使用Vuex。Vuex是Vue的状态管理库，用于在组件之间共享和管理数据。 要解决这个错误，你可以按照以下步骤进行操作： 1. 确保已经正确安装了Vuex。你可以通过在终端中运行以下命令来安装Vuex： ``` npm install vuex ``` 2. 在你的Vue项目中创建一个Vuex store。在项目的根目录下创建一个名为`store.js`的文件，并在其中定义你的Vuex store。以下是一个简单的示例： ```javascript // store.js import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); export default new Vuex.Store({ state: { // 定义你的状态 }, mutations: { // 定义你的mutations }, actions: { // 定义你的actions }, getters: { // 定义你的getters } }); ``` 3. 在你的Vue项目的入口文件（通常是`main.js`）中引入并使用Vuex。在入口文件中添加以下代码： ```javascript // main.js import Vue from 'vue'; import App from './App.vue'; import store from './store'; new Vue({ store, // 将Vuex store 注入到Vue实例中 render: h => h(App) }).$mount('#app'); ``` 4. 在你的组件中使用Vuex。在需要使用Vuex的组件中，你可以通过`this.$store`来访问Vuex store。确保你在组件中正确地使用了`this.$store`，而不是`$store`。以下是一个示例： ```javascript export default { computed: { count() { return this.$store.state.count; // 访问Vuex store中的状态 } }, methods: { increment() { this.$store.commit('increment'); // 调用Vuex store中的mutation } } } ``` 通过按照上述步骤正确配置和使用Vuex，你应该能够解决"TypeError: Cannot read properties of undefined (reading '$store')"这个错误。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大雄不是大熊

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值