当前位置: 首页 > 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…...

ROS2 MoveIt配置实战:解决机械臂在RViz中‘只规划不执行’和模型不显示的常见问题

ROS2 MoveIt实战&#xff1a;机械臂在RViz中规划执行失败的深度排查指南 1. 问题现象与初步诊断 当你在RViz中点击"Plan and Execute"按钮时&#xff0c;机械臂模型却纹丝不动&#xff0c;或者干脆连模型都加载不出来——这种场景恐怕是ROS2开发者最头疼的遭遇之一。…...

实战:利用‘语义锚定’技术,防止竞品通过 AI 生成的内容覆盖你的核心词条

各位编程专家、技术领袖们&#xff0c;大家好&#xff01;今天&#xff0c;我们齐聚一堂&#xff0c;探讨一个在AI时代日益突出的挑战&#xff1a;如何防止竞争对手利用AI生成的内容&#xff0c;稀释甚至覆盖我们品牌的核心技术词条。这不仅仅是SEO的攻防战&#xff0c;更是品牌…...

阿里悟空 vs 腾讯龙虾:大厂 AI 自动化对决,普通人该怎么选?

最近 AI 自动化圈彻底炸了,一边是钉钉推出的阿里悟空,主打企业级合规与深度协同;另一边是腾讯全系铺开的龙虾(QClaw/WorkBuddy),靠着微信遥控、零门槛上手刷屏全网。 很多技术小白、职场人都在跟风 “养龙虾”,但这两个产品到底差在哪?腾讯龙虾真的适合所有人吗?今天…...

Fish Speech 1.5企业培训场景:员工手册/安全规范自动语音化部署

Fish Speech 1.5企业培训场景&#xff1a;员工手册/安全规范自动语音化部署 1. 企业培训的语音化需求 在现代企业培训中&#xff0c;员工手册和安全规范的学习往往面临一个普遍问题&#xff1a;文字材料枯燥乏味&#xff0c;员工阅读积极性不高。传统的纸质手册或电子文档需要…...

告别手动处理!用HyP3+MintPy+ERA5自动化搞定Sentinel-1时序形变分析(保姆级避坑指南)

从零构建Sentinel-1时序形变分析自动化流水线&#xff1a;HyP3MintPyERA5实战手册 当传统InSAR分析流程需要耗费数周时间手动处理数据时&#xff0c;我们如何通过云端服务与开源工具的组合实现效率的指数级提升&#xff1f;本文将揭示一套经过实战检验的自动化解决方案&#xf…...

GLM-4.7-Flash快速上手:开箱即用的最强开源LLM,小白也能秒懂Web界面

GLM-4.7-Flash快速上手&#xff1a;开箱即用的最强开源LLM&#xff0c;小白也能秒懂Web界面 想体验最新最强的开源大模型&#xff0c;但被复杂的部署步骤劝退&#xff1f;担心自己不懂代码&#xff0c;面对命令行无从下手&#xff1f;今天&#xff0c;我要给你介绍一个“懒人福…...

PCL点云处理实战:5分钟搞定PassThrough滤波(附完整代码与可视化对比)

PCL点云处理实战&#xff1a;5分钟掌握PassThrough滤波的核心技巧 点云处理已经成为三维视觉领域不可或缺的技术环节。想象一下&#xff0c;当你拿到一组激光雷达扫描的原始点云数据时&#xff0c;那些杂散的噪声点、无效的远距离点往往会让后续的分析处理变得困难重重。PassTh…...

终极指南:MiroFish群体智能引擎深度解析与实战应用

终极指南&#xff1a;MiroFish群体智能引擎深度解析与实战应用 【免费下载链接】MiroFish A Simple and Universal Swarm Intelligence Engine, Predicting Anything. 简洁通用的群体智能引擎&#xff0c;预测万物 项目地址: https://gitcode.com/GitHub_Trending/mi/MiroFis…...

Sqoop数据更新处理深度解析:增量导入中的更新记录管理

Sqoop数据更新处理深度解析&#xff1a;增量导入中的更新记录管理 引言1. Sqoop处理数据更新的整体机制1.1 Sqoop更新处理的局限性1.2 两种增量模式对更新的支持对比2. Append模式&#xff1a;只处理新增&#xff0c;不处理更新2.1 工作原理2.2 为什么不能处理更新&#xff1f;…...

为数据分析管道增加编排层

多年来&#xff0c;仪表板一直是与数据交互的主要界面。它们呈现指标、可视化趋势&#xff0c;并通过图表和过滤器支持决策。但它们也要求用户解释结果、提出后续问题并手动调查根本原因。 如果这个调查层可以由系统驱动呢&#xff1f; 这就是编排变得关键的地方。 Agentic …...