原因

可能有多种原因, 现在我说一下我碰到的一种情况: 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的变化的更多相关文章

  1. vue常见问题处理 -- 页面刷新时，如何保持原有vuex中的state信息

    一.页面刷新时,如何保持原有vuex中的state信息 页面刷新后,原有的 vuex 中的 state 会发生改变,如果在页面刷新之前,可以将 state 信息保存,页面重新加载时,再将该值赋给 st ...

  2. Vue Vuex中的严格模式/实例解析/dispatch/commit /state/getters

    严格模式 import getters from './getters' import mutations from './mutations' import actions from './acti ...

  3. vue：vuex中mapState、mapGetters、mapActions辅助函数及Module的使用

    一.普通store中使用mapState.mapGetters辅助函数: 在src目录下建立store文件夹: ​ index.js如下: import Vue from 'vue'; import ...

  4. 【vue】vue +element 搭建项目，vuex中的store使用

    概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...

  5. 循序渐进VUE+Element 前端应用开发(2）--- Vuex中的API、Store和View的使用

    在我们开发Vue应用的时候,很多时候需要记录一些变量的内容,这些可以用来做界面状态的承载,也可以作为页面间交换数据的处理,处理这些内容可以归为Vuex的状态控制.例如我们往往前端需要访问后端数据,一般 ...

  6. Vue刷新页面VueX中数据清空了，怎么重新获取？

    Vue刷新页面VueX数据清空了,怎么重新获取? 点击打开视频讲解更详细 在vue中刷新页面后,vuex中的数据就没有了,这时我们要想使用就要重新获取数据了, 怎么在刷新后重新获取数据呢??? 这时我 ...

  7. vuex中store保存的数据，刷新页面会清空

    用vuex,项目中需要记录一些状态,来判断页面是否为登录状态和页面是否可被编辑,此时用到了vuex中的store来存储一个状态. //首先 安装vuex npm install vuex --save ...

  8. vuex 中五大核心以及map函数的应用

    什么是vuex? 我理解的vuex就是数据和状态的管理 如果在模块化构建系统中,请确保在开头调用了 Vue.use(Vuex) 五大核心: const store = new Vuex.Store({ ...

  9. vuex中的辅助函数 mapState,mapGetters, mapActions, mapMutations

    1.导入辅助函数 导入mapState可以调用vuex中state的数据 导入mapMutations可以调用vuex中mutations的方法 四个辅助函数 各自对应自己在vuex上的自己 2.ma ...

随机推荐

  1. .NET - Task.Run vs Task.Factory.StartNew

    翻译自 Stephen Toub 2011年10月24日的博文<Task.Run vs Task.Factory.StartNew>,Stephen Toub 是微软并行计算平台团队的首席 ...

  2. HTTP系列之跨域资源共享机制（CORS）介绍

    前言 本文将继续解析详解HTTP系列1中的请求/ 响应报文的首部字段,今天带来的跨域资源共享(CORS)机制,具体内容包括CORS的原理.流程.实战,希望能给大家带来收获! CORS简介 跨域资源共享 ...

  3. CSP 201312-1 出现次数最多的数

    思路 由于输入的数组元素是 1 ≤ si ≤ 10000,所以开一个 10001 的数组.输入的过程中使用 num 记录出现的最大次数: 在所有输入结束后,遍历数组元素,由于题目要求出现多个众数输出最 ...

  4. Qt QTranslator 实现多语言转换

    1.在*.pro文件里面添加TRANSLATIONS += English.tsChinese.ts根据自己想要添加多少种语言和什么语言视情况添加. 2.a.通过qt ui设计师添加的文字 首先记得选 ...

  5. 高可用集群之corosync+pacemaker

    1.概念 在传统Linux集群种类,主要分了三类,一类是LB集群,这类集群主要作用是对用户的流量做负载均衡,让其后端每个server都能均衡的处理一部分请求:这类集群有一个特点就是前端调度器通常是单点 ...

  6. PHP - 读取EXCEL内容 存入数据库

    <?php //设置请求头 header("Content-Type:text/html;charset=utf8"); header("Access-Contro ...

  7. HMM隐马尔可夫模型来龙去脉（二）

    目录 前言 预备知识 一.估计问题 1.问题推导 2.前向算法/后向算法 二.序列问题 1.问题推导 2.维特比算法 三.参数估计问题 1.问题推导 2.期望最大化算法(前向后向算法) 总结 前言 H ...

  8. 解决warning MSB8012:问题

    问题描述: C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\Microsoft.CppBuild.targets(990,5): warning M ...

  9. 网络协议HTTP、TCP/IP、Socket

    网络协议HTTP.TCP/IP.Socket 网络七层由下往上分别为物理层.数据链路层.网络层.传输层.会话层.表示层和应用层.  其中物理层.数据链路层和网络层通常被称作媒体层,是网络工程师所研究的 ...

  10. 20190928-01Redis五大数据类型之Hash和Zset 000 029