原因

可能有多种原因, 现在我说一下我碰到的一种情况: 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. Java多线程_wait/notify/notifyAll方法

    关于这三个方法,我们可以查询API得到下列解释: wait():导致当前的线程等待,直到其他线程调用此对象的notify( ) 方法或 notifyAll( ) 方法或者指定的事件用完 notify( ...

  2. react项目初始化配置

    ## [初始化项目](https://facebook.github.io/create-react-app/)) + 安装 ``` npx create-react-app myreact ``` ...

  3. 温故知新——Spring AOP

    Spring AOP 面向切面编程,相信大家都不陌生,它和Spring IOC是Spring赖以成名的两个最基础的功能.在咱们平时的工作中,使用IOC的场景比较多,像咱们平时使用的@Controlle ...

  4. @PostConstruct详解

    一.定义: @PostContruct是spring框架的注解,在方法上加该注解会在项目启动的时候执行该方法,也可以理解为在spring容器初始化的时候执行该方法. 从Java EE5规范开始,Ser ...

  5. Agumaster 改善了pagination

    页面越来越完善了.

  6. Nginx之https配置

    14.1. 对称加密 安全隐患:钥匙除我之外,还有多个人拥有.泄露风险较大,钥匙传递的过程风险较大 14.2. 非对称加密 优缺点:私钥很安全.但是非对称算法开销很大,大批量应用于业务,会导致性能成本 ...

  7. Apache Nginx Tomcat

    Tomcat Tomcat:动态解析容器 处理动态请求,是编译JSP/Servlet的容器 区别: 严格意义上来说 Apache和nginx应该叫做HTTP Server tomcat是一个Appli ...

  8. TouchAction实现连续滑动设置手势密码

    首先使用工具获取到元素坐标位置,可以看到起始位置是[144,462],终点位置是[576,894] 分析: 该图形可以横竖划分六等分 那么第一个圆中心点的坐标: x=144+(576-144)/6 y ...

  9. adb安装apk包提示protocol failure问题

    截图来自CSDN,待验证

  10. 吴恩达《深度学习》-第五门课 序列模型(Sequence Models)-第一周 循环序列模型（Recurrent Neural Networks） -课程笔记

    第一周 循环序列模型(Recurrent Neural Networks) 1.1 为什么选择序列模型?(Why Sequence Models?) 1.2 数学符号(Notation) 这个输入数据 ...