当前位置: 首页 > news >正文

vuex properties of undefined (reading ‘getters‘)

前言:

        最近打算用vue 写个音乐播放器,在搞 vuex 的时候遇到一个很神奇报错;vuex 姿势练了千百次了,刚开始的时候我一直以为是代码问题,反复检查了带了,依旧报错。 Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'getters')"

 

 除了 mapGetters 中的 方法 都能把数据都正确,连 mapMutations 中的方法都是对的。

按理说 mapMutations 可以,mapGetters 也应该可以才对!

<script>
import { mapGetters, mapMutations } from "vuex";
export default {data() {return {};},computed: {...mapGetters({userInfo: "userInfo",}),userInfo1() {return this.$stroe.state.userInfo;},},mounted() {console.log("this.$stroe:", this.$stroe);console.log("this.$stroe.mapGetters:", this.$stroe.mapGetters);console.log("this.$stroe.getters:", this.$stroe.getters);console.log("this.$stroe.state.userInfo:", this.$stroe.state.userInfo);console.log("this.userInfo1:", this.userInfo1);console.log("this.saveToken:", this.saveToken);console.log("this.userInfo:", this.userInfo);},methods: {...mapMutations({saveToken: "saveToken",}),},
};
</script>输出
store: {…}
this.$stroe: Store {_committing: false, _actions: {…}, _actionSubscribers: Array(0), _mutations: {…}, _wrappedGetters: {…}, …}commit: ƒ boundCommit(type, payload, options)dispatch: ƒ boundDispatch(type, payload)getters: {}strict: false_actionSubscribers: []_actions: {loadStorage: Array(1), cleanStorage: Array(1)}_committing: false_devtools: undefined_makeLocalGettersCache: {}_modules: ModuleCollection {root: Module}_modulesNamespaceMap: {}_mutations: {saveToken: Array(1), updateToken: Array(1), saveUserinfo: Array(1), updateUserInfo: Array(1)}_scope: EffectScope {detached: true, active: true, effects: Array(2), cleanups: Array(0), parent: undefined}_state: {__ob__: Observer}_subscribers: []_wrappedGetters: {userInfo: ƒ, token: ƒ}state: (…)[[Prototype]]: Objectthis.$stroe.mapGetters: undefined
this.$stroe.getters: {}
this.$stroe.state.userInfo: {…}
this.userInfo1: {…}
this.saveToken: ƒ mappedMutation() {var args = [],len = arguments.length;while (len--) args[len] = arguments[len];// Get the commit method from storevar commit = this.$store.commi…

       

解决:

        各种姿势都试了,这次不知道啥情况。代码也检查了;项目重启了, 电脑也重启了。 磨了很长时间 最后试了下 换了个 vuex 版本就然可以了 ! 最后才发现 原来是 引用的 vuex 4.1.0, 版本回退到 3.6.2 就可以了 ,给大家填个坑

相关文章:

vuex properties of undefined (reading ‘getters‘)

前言&#xff1a; 最近打算用vue 写个音乐播放器&#xff0c;在搞 vuex 的时候遇到一个很神奇报错&#xff1b;vuex 姿势练了千百次了&#xff0c;刚开始的时候我一直以为是代码问题&#xff0c;反复检查了带了&#xff0c;依旧报错。 Error in mounted hook: "TypeError:…...

再谈表的约束

文章目录 自增长唯一键外键 自增长 auto_increment&#xff1a;当对应的字段&#xff0c;不给值&#xff0c;会自动的被系统触发&#xff0c;系统会从当前字段中已经有的最大值1操作&#xff0c;得到一个新的不同的值。通常和主键搭配使用&#xff0c;作为逻辑主键。 自增长的…...

认识一下测试策略与测试方案

目录 测试方案 测试策略 测试策略的内容主要包括 测试技术和工具 测试启动、停止和完成标准 风险分析和应对方案 测试范围 测试角色和职责 测试方法和类型 测试工具 测试层级 测试指标 测试可交付成果 测试方案的内容包括 测试目标 测试范围 测试环境 测试策略…...

Gradle 查看包的依赖关系

在 Terminal 中可以通过 gradle 的命令查看项目中使用的依赖库及其版本&#xff0c;并且可以更加直观的看到各个模块中库之间的依赖关系。同时也可以跟踪并解决与库版本冲突有关的问题。 工具查看 在 Android Studio 中选择 View > Tool Windoors > Gradle 或者直接选择…...

虚幻5|给攻击添加特效

一&#xff0c;打开武器蓝图 选择武器网格体&#xff0c;在细节处找到组件开始重叠&#xff0c;点击 写下以下蓝图&#xff0c;这是最终蓝图&#xff0c;后面会分讲要点 二&#xff0c;actor拥有标签&#xff0c;就是被击打的敌人&#xff0c;我们给actor添加标签 到主界面&am…...

Delphi包管理与依赖:掌握GetIt与DelphiPI的艺术

标题&#xff1a;Delphi包管理与依赖&#xff1a;掌握GetIt与DelphiPI的艺术 在Delphi的广袤生态中&#xff0c;包管理和依赖解决方案是构建大型项目不可或缺的工具。本文将深入探讨Delphi中的两种主要包管理工具&#xff1a;GetIt包管理器和DelphiPI&#xff0c;通过实际代码…...

如何使用unittest和pytest进行python脚本的单元测试

1. 关于unittest和pytest unittest是python内置的支持单元测试的模块&#xff0c;他提供了核心类&#xff0c;TestCase&#xff0c;让单元测试 代码的编写不再是从0开始&#xff0c;不再是作坊式&#xff0c;而是标准化&#xff0c;模板化&#xff0c;工厂化。 pytest是第三方…...

Java中的值传递与引用传递

Java中的值传递与引用传递 在Java编程中&#xff0c;理解值传递与引用传递的概念是编写无误代码的关键。这两个概念有时会让人感到困惑&#xff0c;特别是当它们与对象有关时。现在&#xff0c;我们将一步步地解释这两个概念&#xff0c;帮助你彻底理解它们。 1. 值传递与引用…...

Seaborn库

目录 主要功能和特点 使用方法 实例应用 Seaborn库的最新版本有哪些新功能和改进&#xff1f; 如何在Seaborn中实现复杂的数据预处理步骤&#xff0c;例如数据清洗和转换&#xff1f; Seaborn与其他数据可视化库&#xff08;如Matplotlib、Plotly&#xff09;相比有哪些优…...

openresty整合modsecurity

安装依赖包 安装依赖 yum -y install gcc-c flex bison yajl yajl-devel curl-devel curl GeoIP-devel doxygen zlib-devel libtool libxml2-devel libxslt-devel安装依赖包 ftp://ftp.icm.edu.pl/vol/rzm7/linux-centos-vault/7.8.2003/sclo/x86_64/rh/Packages/d/devtools…...

结构体structure、共用体union

目录 结构体 结构体类型的定义形式 结构体类型的大小 内存计算例子 共用体union 用共用体判断大小端 结构体和共用体对比 qsort&#xff08;&#xff09; 结构体 结构体类型——用来描述复杂数据的一种数据类型 构造类型&#xff08;用户自定义类型&#xff09; struc…...

Spring自动注册-<bean>标签和属性解析

xml文件中最常见也最核心的就是<bean>,<Import>,<beans>,<alias>标签,关于它们的解析主要是BeanDefinitionParserDelegate类中.<bean>标签的解析最为复杂和重要. <bean>标签 processBeanDefinition(ele, delegate)方法中,主要是是对…...

【仿RabbitMQ消息队列】基于C++11中packaged_tack异步线程池

目录 什么是同步和异步&#xff1f; future 使用future和async配合管理异步任务 使用promise和future配合管理异步任务 使⽤std::packaged_task和std::future配合 C11异步线程池 什么是同步和异步&#xff1f; 同步&#xff08;Synchronous&#xff09; 同步编程是指程…...

免费下载专利

给大家提供一个可以免费下载专利的地方 链接&#xff1a;https://www.drugfuture.com/cnpat/cn_patent.asp...

CentOS7安装流程步骤详细教程

1. 简介 1.1. 概述 CentOS 7是一款基于Red Hat Enterprise Linux(RHEL)的开源Linux发行版,它提供了一个稳定、安全、高效的操作系统,适用于企业级应用、服务器、云计算等领域。CentOS 7以其高度的稳定性和安全性而闻名,它广泛应用于各种行业和领域,包括政府、金融、医疗、…...

【大模型从入门到精通17】openAI API 构建和评估大型语言模型(LLM)应用5

这里写目录标题 理论问题&#xff1a;实践问题&#xff1a;理论实践 理论问题&#xff1a; 1.描述评估LLM应用程序输出的重要性&#xff0c;并提及至少三个维度&#xff0c;这些输出应该在这几个维度上被评估。 2.解释在评估LLM应用程序时开发稳健的性能指标的作用&#xff0c…...

苹果手机无iCloud备份下“最近删除”照片的恢复策略

iPhone最近删除清空了照片还能恢复吗&#xff1f;大家都知道&#xff0c;照片对于我们来说是承载着美好回忆的一种形式。它记录着我们的平淡生活&#xff0c;也留住了我们的美好瞬间&#xff0c;因此&#xff0c;具有极其重要的纪念价值。但由于我们的失误操作导致照片被删除&a…...

Docker搭建Minio容器

Docker搭建Minio容器 前言 在上一集我们介绍了分布式文件存储行业解决方案以及技术选型。最终我们决定选用Minio作为分布式文件存储。 那么这集我们就在Docker上搭建Minio容器即可。 Docker搭建Minio容器步骤 创建Minio文件目录 我们选择创建/minio/data目录 修改目录权…...

【C++】多源BFS问题和拓扑排序

目录 多源BFS介绍 单源BFS和多源BFS的区别 SO如何解决多源BFS问题 多源之核心 矩阵 算法思路 代码实现 飞地的数量 算法思路 代码实现 地图中的最高点 算法思路 代码实现 地图分析 算法思路 代码实现 拓扑排序介绍 有向无环图 ​编辑 如何解决这类问题 课…...

CentOS 7 安装详细教程

​ 大家好&#xff0c;我是程序员小羊&#xff01; 前言&#xff1a; CentOS 7 是一个稳定的企业级 Linux 发行版&#xff0c;广泛用于服务器环境。CentOS 7 是基于 Red Hat Enterprise Linux (RHEL) 构建的企业级 Linux 发行版&#xff0c;提供免费的、开源的操作系统&#xf…...

链表专项(二):链表反转、环判断

大家好,欢迎来到《算法面试60讲(2026最新版全真题带解析)》的第10篇内容!上一篇我们掌握了单链表、双链表的增删改查基础操作,本节课将聚焦链表专项的核心难点——链表反转和环判断,这两个考点是大厂面试中链表部分的“高频必考题”,无论是校招还是社招,几乎都会出现,…...

C语言中的数据类型存储

1、二进制和进制转换我们经常能听到 2 进制、 8 进制、 10 进制、 16 进制 这样的讲法&#xff0c;那是什么意思呢&#xff1f;其实2进制、8进制、10进制、16进制是数值的不同表⽰形式⽽已。⽐如&#xff1a;数值15的各种进制的表⽰形式(十六进制的数值之前写&#xff1a;0x &a…...

数字信号处理实战:从零极点图到系统特性分析

1. 零极点图&#xff1a;数字信号处理的"X光片" 第一次接触零极点图时&#xff0c;我完全不明白这些散落在复平面上的小圆圈和叉叉有什么用。直到有次调试音频滤波器&#xff0c;当我把一个极点的位置向单位圆外移动了0.1&#xff0c;喇叭里立刻传出刺耳的啸叫声——…...

《Web前端实战:从零构建“漫步时尚广场”电商后台管理系统》

1. 电商后台管理系统前端架构设计 第一次接触电商后台管理系统开发时&#xff0c;我被各种功能模块搞得晕头转向。直到把整个系统拆解成几个核心部分&#xff0c;才真正理清思路。"漫步时尚广场"这个案例就很典型&#xff0c;我们可以把它看作由三大结构层组成&#…...

Ember Simple Auth 高级技巧:自定义认证器与存储实现指南

Ember Simple Auth 高级技巧&#xff1a;自定义认证器与存储实现指南 【免费下载链接】ember-simple-auth A library for implementing authentication/authorization in Ember.js applications. 项目地址: https://gitcode.com/gh_mirrors/em/ember-simple-auth Ember …...

CIPHR技术:硬件IP保护的密码学革新与实践

1. 硬件IP保护的技术挑战与CIPHR的创新价值在全球半导体产业链分工日益精细的今天&#xff0c;设计公司不得不将芯片制造环节外包给第三方代工厂&#xff0c;这种模式虽然降低了成本&#xff0c;却也带来了严重的安全隐患。想象一下&#xff0c;你花费数月精心设计的电路图&…...

Flutter 状态管理架构设计完全指南

Flutter 状态管理架构设计完全指南 引言 状态管理是 Flutter 应用开发的核心问题之一。一个好的状态管理架构能够使代码更加清晰、可维护和可测试。本文将深入探讨 Flutter 状态管理的各种架构模式和最佳实践。 状态管理概述 Flutter 中的状态可以分为以下几类&#xff1a; 局部…...

不只是安装!用Docker一键搞定OpenVSLAM开发环境,顺便聊聊它的Web查看器怎么用

从零构建OpenVSLAM容器化开发环境&#xff1a;Web可视化与高效调试实战 在视觉SLAM研究领域&#xff0c;环境配置往往是阻碍开发者快速上手的首要障碍。不同版本的依赖库冲突、系统环境差异导致的运行失败&#xff0c;这些问题消耗了研究者大量本该用于算法创新的宝贵时间。本…...

机器学习之逻辑回归详解

摘要逻辑回归&#xff08;Logistic Regression&#xff09;是机器学习中最基础且应用最广泛的分类算法之一。尽管名字中带有“回归”二字&#xff0c;但它实际上是一种经典的分类算法&#xff0c;主要用于解决二分类和多分类问题。本文将从几何回归的原理出发&#xff0c;详细介…...

开发AI智能体时利用Taotoken实现多模型灵活调用的策略

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 开发AI智能体时利用Taotoken实现多模型灵活调用的策略 在构建复杂的AI智能体工作流时&#xff0c;一个常见的挑战是如何为不同的子…...