vuex存储复杂参数(如对象数组等)刷新数据丢失的解决方法


Posted in Javascript onNovember 05, 2019

我需要在搜索页拿到结果之后跳转到搜索结果页并携带搜索结果

尝试过几种方法之后最终采用vuex+sessionStorage结合的方法在mutations中

setResultValue(state,flag){
 sessionStorage.setItem("resultValue", JSON.stringify(flag))
 state.resultValue = flag
}

在getters中

getResultValue

getResultValue(state){
 state.resultValue = sessionStorage.getItem("resultValue")
 return state.resultValue
}

在跳转后的页面获取这个数据

this.resultValue = JSON.parse(store.getters.getResultValue)

这里可以看到我们用了JSON.stringify和JSON.parse是因为sessionStorage存储对象的需要,不然在页面获取时只能得到:“[object,object]”

以上这篇vuex存储复杂参数(如对象数组等)刷新数据丢失的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 检测浏览器类型和版本的代码
Sep 15 Javascript
javascript 数组学习资料收集
Apr 11 Javascript
各浏览器中querySelector和querySelectorAll的实现差异分析
May 23 Javascript
js循环改变div颜色具体方法
Jun 25 Javascript
使用jquery hover事件实现表格的隔行换色功能示例
Sep 03 Javascript
JQuery1.8 判断元素是否绑定事件的方法
Jul 10 Javascript
js实现背景图自适应窗口大小
Jan 10 Javascript
bootstrap基本配置_动力节点Java学院整理
Jul 14 Javascript
vue两组件间值传递 $router.push实现方法
May 15 Javascript
详解vuex之store源码简单解析
Jun 13 Javascript
使用Vue.js和MJML创建响应式电子邮件
Mar 23 Vue.js
vue+spring boot实现校验码功能
May 27 Vue.js
解决vue.js提交数组时出现数组下标的问题
Nov 05 #Javascript
js+html实现点名系统功能
Nov 05 #Javascript
vuex 实现getter值赋值给vue组件里的data示例
Nov 05 #Javascript
在Vue mounted方法中使用data变量详解
Nov 05 #Javascript
解决vue项目F5刷新mounted里的函数不执行问题
Nov 05 #Javascript
vue input标签通用指令校验的实现
Nov 05 #Javascript
vue子传父关于.sync与$emit的实现
Nov 05 #Javascript
You might like
让你同时上传 1000 个文件 (一)
2006/10/09 PHP
php a simple smtp class
2007/11/26 PHP
分享一个漂亮的php验证码类
2016/09/29 PHP
一个cssQuery对象 javascript脚本实现代码
2009/07/21 Javascript
js几个验证函数代码
2010/03/25 Javascript
JQuery设置和去除disabled属性的5种方法总结
2013/05/16 Javascript
Script标签与访问HTML页面详解
2014/01/10 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
2015/11/29 Javascript
JavaScript实现滑动门效果
2020/01/18 Javascript
[05:46]2018完美盛典-《同梦共竞》
2018/12/17 DOTA
[02:58]魔廷新尊——痛苦女王至宝语音台词节选
2020/06/14 DOTA
python实现代理服务功能实例
2013/11/15 Python
python实现查询IP地址所在地
2015/03/29 Python
Python实现简单拆分PDF文件的方法
2015/07/30 Python
Python简单实现两个任意字符串乘积的方法示例
2018/04/12 Python
python实现支付宝当面付(扫码支付)功能
2018/05/30 Python
我用Python抓取了7000 多本电子书案例详解
2019/03/25 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
爬虫代理池Python3WebSpider源代码测试过程解析
2019/12/20 Python
Python如何实现远程方法调用
2020/08/07 Python
python多线程semaphore实现线程数控制的示例
2020/08/10 Python
Python如何爬取51cto数据并存入MySQL
2020/08/25 Python
CSS3实现头像旋转效果
2017/03/13 HTML / CSS
浅谈Html5中视频 音频标签 进度条的问题
2016/07/26 HTML / CSS
俄罗斯眼镜网: optikaworld
2016/07/31 全球购物
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
世界上最具创新性的增强型知名运动品牌:Proviz
2018/04/03 全球购物
马来西亚在线购物:POPLOOK.com
2019/12/09 全球购物
本科生的职业生涯规划范文
2014/01/09 职场文书
会计工作决心书
2014/03/11 职场文书
调解协议书
2014/04/16 职场文书
刑事代理授权委托书
2014/09/17 职场文书
作风整顿剖析材料
2014/09/30 职场文书
交通局领导班子群众路线教育实践活动对照检查材料思想汇报
2014/10/09 职场文书
基层党组织整改方案
2014/10/25 职场文书
Python中Schedule模块使用详解 周期任务神器
2022/04/19 Python