vue:vue页面刷新vuex数据消失问题
vuex中数据刷新页面消失问题:
a页面请求的数据保存在vuex中,只要不刷新,那跳转到b页面里也可以用,但如果b页面刷新,那vuex里的数据就会消失,
可以得解决方法:a页面用的数据a页面的生命周期函数里请求,b页面用的数据b页面的生命周期函数里请求
你需要知道JavaScript代码是运行在内存中的,代码运行时的所有变量,函数,也都是保存在内存中的。
刷新页面,以前申请的内存被释放,重新加载脚本代码,变量重新赋值,所以这些数据要想储存就必须储存在外部,例如:Local Storage, Session Storage, IndexDB等。
这些是浏览器提供的API,让你可以将数据储存在硬盘上,做持久化储存。具体选择哪一个就根据你实际的需求来决定。
const ls = window.localStorage
// https://github.com/tsironis/lockr
export default {
getItem(key) {
try {
return JSON.parse(ls.getItem(key))
} catch (err) {
return null
}
},
setItem(key, val) {
ls.setItem(key, JSON.stringify(val))
},
clear() {
ls.clear()
},
keys() {
return ls.keys()
},
removeItem(key) {
ls.removeItem(key)
}
}
vue:vue页面刷新vuex数据消失问题的更多相关文章
- 页面刷新vuex数据消失问题解决方案 之 vuex中间件
之前我写了一篇用ES6 Proxy方案解决数据同步的文章 页面刷新vuex数据消失问题解决方案. 今天和同事沟通这个vuex数据还原问题,我说我的方法很奇异.聊着聊着,同事咋不用 store.sub ...
- 页面刷新vuex数据消失问题解决方案
VBox持续进行中,哀家苦啊,有没有谁给个star. vuex是vue用于数据存储的,和redux充当同样的角色. 最近在VBox开发的时候遇到的问题,页面刷新或者关闭浏览器再次打开的时候数据归零.这 ...
- 页面刷新 vuex 数据重新被初始化
1.原因 vuex里用来存储的也只是一个全局变量,当页面刷新,该全局变量自然不存在了. 2.解决 使用localStorage存储一份 (1)storage.js /** * vuex localSt ...
- 使用sessionStorage解决vuex在页面刷新后数据被清除的问题
https://www.jb51.net/article/138218.htm 1.原因 2.解决方法 localStorage没有时间期限,除非将它移除,sessionStorage即会话,当浏览器 ...
- vue 使用localStorage解决vuex在页面刷新后数据被清除的问题
通常,我们在使用vue编写页面时,会需要使用vuex在组件间传递(或者说共同响应)同一个数据的变化.例如:用户的登录信息. 下面,我们使用传递用户登录信息的例子来一步步解决这个问题. 首先,我们的第一 ...
- 【vue】使用localStorage解决vuex在页面刷新后数据被清除的问题
通常,我们在使用vue编写页面时,会需要使用vuex在组件间传递(或者说共同响应)同一个数据的变化.例如:用户的登录信息. 下面,我们使用传递用户登录信息的例子来一步步解决这个问题. 首先,我们的第一 ...
- JS页面刷新保持数据不丢失
转自:https://blog.csdn.net/qq_32439101/article/details/78134877 下面是 DOM Storage 的接口定义: interface Stora ...
- nignx部署Vue单页面刷新路由404问题解决
官网说明: https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E8%AD%A6%E5%91%8A 在linux下搭建ngi ...
- vue 浏览器页面刷新时执行一段代码
当刷新(浏览器刷新)页面的时候,重置到首页(或其他页面)纯js的是window.onload()但是vue几乎不会用到这个,vue所有的是生命周期那么我们可以根据生命周期来实现这个beforeCrea ...
随机推荐
- 文字超长隐藏为...ie7不兼容的解决办法
把li里的a设置display:block; 代码如下: html: <ul> <li><span>2014-8-27</span><a href ...
- MySQL并发复制系列一:binlog组提交 (转载)
http://blog.csdn.net/woqutechteam/article/details/51178803 MySQL Binary log在MySQL 5.1版本后推出主要用于主备复制的 ...
- F5负载均衡原理(转载)
https://blog.csdn.net/panxueji/article/details/42647193 一. 负载均衡技术 负载均衡技术在现有网络结构之上提供了一种廉价.有效.透明的方法,来扩 ...
- C#列的一些操作
//变更列名 DataTableA.Columns["原来的列名"].ColumnName="新的列名";
- 第11章 拾遗5:IPv6和IPv4共存技术(3)_NAT-PT技术【全书完】
6.4 NAT-PT (1)NAT-PT和NAT的差别 ①NAT-PT(附带协议转换的网络地址转换)技术秉承NAT技术的思想,但在原理方面大有不同. ②NAT-PT和NAT本质的区别在于应用场合的不同 ...
- scrapy框架之分布式操作
分布式概念 分布式爬虫: 1.概念:多台机器上可以执行同一个爬虫程序,实现网站数据的分布爬取. 2.原生的scrapy是不可以实现分布式爬虫? a)调度器无法共享 b)管道无法共享 3.scrapy- ...
- CS229 6.14 Neurons Networks Restricted Boltzmann Machines
1.RBM简介 受限玻尔兹曼机(Restricted Boltzmann Machines,RBM)最早由hinton提出,是一种无监督学习方法,即对于给定数据,找到最大程度拟合这组数据的参数.RBM ...
- CS229 6.1 Neurons Networks Representation
面对复杂的非线性可分的样本是,使用浅层分类器如Logistic等需要对样本进行复杂的映射,使得样本在映射后的空间是线性可分的,但在原始空间,分类边界可能是复杂的曲线.比如下图的样本只是在2维情形下的示 ...
- “javac”不是内部或外部命令的解决办法(JDK1.5 ~ JDK10)
配置环境变量:计算机 -> 属性 -> 高级系统设置 -> 环境变量 JDK9以后版本(9-10): JAVA_HOME D:\Java\jdk-10 //jdk所在目录 JRE_H ...
- async 常用函数总结
待更新. waterfall auto(神器) parallel mapSeries(数据库多条记录操作神器)