原因

可能有多种原因, 现在我说一下我碰到的一种情况: 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. 防止用户利用PHP代码DOS造成用光网络带宽

    用PHP代码调用sockets,直接用服务器的网络攻击别的IP,常见代码如下: 代码如下:$packets = 0; $ip = $_GET[\'ip\']; $rand = $_GET[\'port ...

  2. oracle之回顾二

    TCL 1.  事务(Transaction) 事务(Transaction)是一个操作序列.这些操作要么都做, 要么都不做, 是一个不可分割的工作单元, 是数据库环境中的最小工作单元. 1.1 事务 ...

  3. 数字电路基础（二）TTL与非门输入端悬空和接大电阻的问题

    引言 我们在做那些判断与非门输入输出的时候,常常把输入端悬空和接大电阻作为高电平输入处理,比如下边这一例题: 很显然,我们无法直接从与非门逻辑图中看出其内部工作原理,那我们该如何分析呢?那肯定是去分析 ...

  4. Android开发之Eclipse与Android Studio的java类 作者版权模板

    /** * 作者:${USER} on ${DATE} ${HOUR}:${MINUTE} * * 联系QQ:986945193 * * 微博:http://weibo.com/mcxiaobing ...

  5. gson 处理null

    1.定义null处理类 class StringConverter : JsonSerializer<String?>, JsonDeserializer<String?> { ...

  6. kotlin 作用域函数 : let、run、with、apply、 also、takeIf、takeUnless

    1.官方文档 英文: https://kotlinlang.org/docs/reference/scope-functions.html 中文: https://www.kotlincn.net/d ...

  7. add forward

    adb forward tcp:34999 localabstract:Unity-com.kingsgroup.rob adb forward --list adb forward --remove ...

  8. HDU - 1272-小希的迷宫（连通图+环的判断）

    上次Gardon的迷宫城堡小希玩了很久(见Problem B),现在她也想设计一个迷宫让Gardon来走.但是她设计迷宫的思路不一样,首先她认为所有的通道都应该是双向连通的,就是说如果有一个通道连通了 ...

  9. vue 0点定时网络请求

    export default { data() { return { timer: null, currentTime: '', zeroTime: '00:00:05', // zeroTime: ...

  10. 持续部署入门：基于 Kubernetes 实现蓝绿发布

    前言 软件世界比以往任何时候都更快.为了保持竞争力,需要尽快推出新的软件版本,而不会中断活跃用户访问,影响用户体验.越来越多企业已将其应用迁移到 Kubernetes. 在 Kubernetes 中有 ...