VueX中state变化捕捉不到_getters监测不到state的变化
原因
可能有多种原因, 现在我说一下我碰到的一种情况: state种有一个变量叫state,它是一个json对象, 可把我害惨了.因为他这个json长这个样:
messageBox:{
friendId1: [ {message1}, {message2}, ... ],
friendId2: [ {message1}, {message2}, ... ],
friendId3: [ {message1}, {message2}, ... ],
friendId4: [ {message1}, {message2}, ... ]
}
当我在mutation中改变好友message列表的时候, 无论在Vue组件中使用watch, 亦或者在VueX中使用getters, 都不能够在messageBox变化的时候触发监听器. 网上找了很多解决方法,伤透了脑筋, 最后还是想了一个土方法给解决了. 别看土, 还真有用!
solution
将messageBox赋值为字符串形式, messageBox = " {} ", 随后在mutation中改变messageBox的时候, 使用JSON.parse转换为json格式, 更改后在用过逆运算JSON.Stringify转化为字符串, 这个时候getters就可以自动捕获到state中的变化了
VueX中state变化捕捉不到_getters监测不到state的变化的更多相关文章
- vue常见问题处理 -- 页面刷新时,如何保持原有vuex中的state信息
一.页面刷新时,如何保持原有vuex中的state信息 页面刷新后,原有的 vuex 中的 state 会发生改变,如果在页面刷新之前,可以将 state 信息保存,页面重新加载时,再将该值赋给 st ...
- Vue Vuex中的严格模式/实例解析/dispatch/commit /state/getters
严格模式 import getters from './getters' import mutations from './mutations' import actions from './acti ...
- vue:vuex中mapState、mapGetters、mapActions辅助函数及Module的使用
一.普通store中使用mapState.mapGetters辅助函数: 在src目录下建立store文件夹: index.js如下: import Vue from 'vue'; import ...
- 【vue】vue +element 搭建项目,vuex中的store使用
概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...
- 循序渐进VUE+Element 前端应用开发(2)--- Vuex中的API、Store和View的使用
在我们开发Vue应用的时候,很多时候需要记录一些变量的内容,这些可以用来做界面状态的承载,也可以作为页面间交换数据的处理,处理这些内容可以归为Vuex的状态控制.例如我们往往前端需要访问后端数据,一般 ...
- Vue刷新页面VueX中数据清空了,怎么重新获取?
Vue刷新页面VueX数据清空了,怎么重新获取? 点击打开视频讲解更详细 在vue中刷新页面后,vuex中的数据就没有了,这时我们要想使用就要重新获取数据了, 怎么在刷新后重新获取数据呢??? 这时我 ...
- vuex中store保存的数据,刷新页面会清空
用vuex,项目中需要记录一些状态,来判断页面是否为登录状态和页面是否可被编辑,此时用到了vuex中的store来存储一个状态. //首先 安装vuex npm install vuex --save ...
- vuex 中五大核心以及map函数的应用
什么是vuex? 我理解的vuex就是数据和状态的管理 如果在模块化构建系统中,请确保在开头调用了 Vue.use(Vuex) 五大核心: const store = new Vuex.Store({ ...
- vuex中的辅助函数 mapState,mapGetters, mapActions, mapMutations
1.导入辅助函数 导入mapState可以调用vuex中state的数据 导入mapMutations可以调用vuex中mutations的方法 四个辅助函数 各自对应自己在vuex上的自己 2.ma ...
随机推荐
- 从 BIO、NIO 聊到 Netty,最后还要实现个 RPC 框架!
大家好,我是 「后端技术进阶」 作者,一个热爱技术的少年. 觉得不错的话,欢迎 star!ღ( ´・ᴗ・` )比心 Netty 从入门到实战系列文章地址:https://github.com/Snai ...
- SpringBoot系列——MyBatis-Plus整合封装
前言 MyBatis-Plus是一款MyBatis的增强工具(简称MP),为简化开发.提高效率,但我们并没有直接使用MP的CRUD接口,而是在原来的基础上封装一层通用代码,单表继承我们的通用代码,实现 ...
- 保护wordpress后台登录地址
前几天有个群友的wordpress网站被后台入侵了,吓得我赶紧看了看网站日志,密密麻麻的404,扫描我的后台登录地址.还好之前有了安全措施: 纯代码保护后台登录地址,防止爆破 //保护后台登录add_ ...
- C#.WinForm 拖动文件到PictrueBox(支持跨UAC拖动)
如程序以普通方式打开,那么DragDrop DragEnter 事件是可以正常使用的.但以管理员身份运行时,这两个方法将失效. 原因是 Windows机制(用户界面特权隔离). UIPI:用户界面特权 ...
- eclipse 设置默认编码为Utf-8 详细教程。
需要设置的几处地方为: Window->Preferences->General ->Content Type->Text->JSP 最下面设置为UTF-8 Window ...
- Fitness - 05.23
倒计时222天 运动40分钟,共计8组,4.2公里.拉伸10分钟. 每组跑步3分钟(6.5KM/h),走路2分钟(5.5KM/h). 终于赶在姨妈前完成第3周的跑步训练了,可喜可贺~~ 下周预计要休息 ...
- 【HttpRunner v3.x】笔记—6. 测试用例-teststeps-RunRequest
之前我们了解了config里的各项参数,今天来了解另一个重要部分--teststeps,在这之前,先看看测试用例的分层模型. 一.测试用例分层模型 一个testcase里(就是一个pytest格式的P ...
- cdispaly的Grid布局与Flex布局
cdispaly的Grid布局与Flex布局 Gird 布局与 Flex 布局有一定的相似性,都是对容器的内部项目进行划分. Flex 布局是轴线布局,只能指定项目针对轴线的位置,可以看作成一维布局 ...
- 抓包工具Burp Suite安装步骤(待补充)
Burp Suite V2.1(破解版)安装步骤:(可以自行下载破解版或汉化版) 百度网盘下载地址: 链接:https://pan.baidu.com/s/1bU5JME3OsEsXrSirTdesR ...
- mysql版本和模式查询
查找数据库的: select version() select @@sql_mode 上面是查版本号,下面是查sql-mode,改sql-model要在mysql目录下配置文件 my.ini, 改修改 ...