原因

可能有多种原因, 现在我说一下我碰到的一种情况: 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. 从 BIO、NIO 聊到 Netty,最后还要实现个 RPC 框架!

    大家好,我是 「后端技术进阶」 作者,一个热爱技术的少年. 觉得不错的话,欢迎 star!ღ( ´・ᴗ・` )比心 Netty 从入门到实战系列文章地址:https://github.com/Snai ...

  2. SpringBoot系列——MyBatis-Plus整合封装

    前言 MyBatis-Plus是一款MyBatis的增强工具(简称MP),为简化开发.提高效率,但我们并没有直接使用MP的CRUD接口,而是在原来的基础上封装一层通用代码,单表继承我们的通用代码,实现 ...

  3. 保护wordpress后台登录地址

    前几天有个群友的wordpress网站被后台入侵了,吓得我赶紧看了看网站日志,密密麻麻的404,扫描我的后台登录地址.还好之前有了安全措施: 纯代码保护后台登录地址,防止爆破 //保护后台登录add_ ...

  4. C#.WinForm 拖动文件到PictrueBox(支持跨UAC拖动)

    如程序以普通方式打开,那么DragDrop DragEnter 事件是可以正常使用的.但以管理员身份运行时,这两个方法将失效. 原因是 Windows机制(用户界面特权隔离). UIPI:用户界面特权 ...

  5. eclipse 设置默认编码为Utf-8 详细教程。

    需要设置的几处地方为: Window->Preferences->General ->Content Type->Text->JSP 最下面设置为UTF-8 Window ...

  6. Fitness - 05.23

    倒计时222天 运动40分钟,共计8组,4.2公里.拉伸10分钟. 每组跑步3分钟(6.5KM/h),走路2分钟(5.5KM/h). 终于赶在姨妈前完成第3周的跑步训练了,可喜可贺~~ 下周预计要休息 ...

  7. 【HttpRunner v3.x】笔记—6. 测试用例-teststeps-RunRequest

    之前我们了解了config里的各项参数,今天来了解另一个重要部分--teststeps,在这之前,先看看测试用例的分层模型. 一.测试用例分层模型 一个testcase里(就是一个pytest格式的P ...

  8. cdispaly的Grid布局与Flex布局

    cdispaly的Grid布局与Flex布局 Gird 布局与 Flex 布局有一定的相似性,都是对容器的内部项目进行划分. Flex 布局是轴线布局,只能指定项目针对轴线的位置,可以看作成一维布局 ...

  9. 抓包工具Burp Suite安装步骤(待补充)

    Burp Suite V2.1(破解版)安装步骤:(可以自行下载破解版或汉化版) 百度网盘下载地址: 链接:https://pan.baidu.com/s/1bU5JME3OsEsXrSirTdesR ...

  10. mysql版本和模式查询

    查找数据库的: select version() select @@sql_mode 上面是查版本号,下面是查sql-mode,改sql-model要在mysql目录下配置文件 my.ini, 改修改 ...