vuex存数据,防止刷新数据丢失
1 created() {
2 if (sessionStorage.getItem('store')) {
3 this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem('store'))))
4 }
5 let isOnIOS = navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPhone/i);
6 let eventName = isOnIOS ? 'pagehide' : 'beforeunload';
7
8 window.addEventListener(eventName, () => {
9 sessionStorage.setItem('store', JSON.stringify(this.$store.state));
10 })
11 }
vuex存数据,防止刷新数据丢失的更多相关文章
- npm安装vuex及防止页面刷新数据丢失
npm install vuex 在项目scr目录下新建store文件夹,在store文件夹下新建index.js文件. import Vue from 'vue'; import Vuex from ...
- Vuex数据页面刷新丢失问题解决方案
用Vue做项目开发很久了,对于vuex能用.会用,但是因为状态脱离页面和刷新丢失两个原因,一直都有种抵触,特别是一些简单的数据都是通过query或者本地存储就解决了,然而对于一些复杂内容,不可避免的还 ...
- 解决vuex的数据刷新(F5)后会被初始化的问题
介绍一个vuex的数据刷新(F5)后会被初始化的问题处理的插件:vuex-localstorage 实现的原理大概就是监听浏览器的刷新,关闭事件,把vuex的值存储到本地localstorage,刷新 ...
- vuex页面刷新数据丢失的解决办法
在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例 ...
- 解决vuex数据页面刷新后初始化问题
在vue项目的开发中经常会用到vuex来进行数据的存储,然而在开发过程中会出现刷新后页面的vuex的state数据初始化问题!下面是我用过的解决方法 利用storage缓存来实现vuex数据的刷新问题 ...
- vue传参页面刷新数据丢失问题
在做vue的时候,经常会遇到组件之间数据的传递问题,通过params或者query传参,但是,当页面刷新的时候,数据会丢失,找不到数据.今天经过总结,解决了这个问题.通过了一下几种情况进行传值: 通过 ...
- ElasticSearch 学习记录之 分布式文档存储往ES中存数据和取数据的原理
分布式文档存储 ES分布式特性 屏蔽了分布式系统的复杂性 集群内的原理 垂直扩容和水平扩容 真正的扩容能力是来自于水平扩容–为集群添加更多的节点,并且将负载压力和稳定性分散到这些节点中 ES集群特点 ...
- Package设计1:选择数据类型、暂存数据和并发
SSIS 设计系列: Package设计1:选择数据类型.暂存数据和并发 Package设计2:增量更新 Package 设计3:数据源的提取和使用暂存 一,数据类型的选择 对于SSIS的数据类型,容 ...
- innodb是如何存数据的?yyds
前言 如果你使用过mysql数据库,对它的存储引擎:innodb,一定不会感到陌生. 众所周知,在mysql8以前,默认的存储引擎是:myslam.但mysql8之后,默认的存储引擎已经变成了:inn ...
随机推荐
- 【leetcode】949. Largest Time for Given Digits
题目如下: Given an array of 4 digits, return the largest 24 hour time that can be made. The smallest 24 ...
- 数字IT基础-数据采集总线
摘要: 日志服务是阿里自产自用的产品,在双十一.双十二和新春红包期间承载阿里云/蚂蚁全站.阿里电商板块.云上几千商家数据链路,每日处理来自百万节点几十PB数据,峰值流量达到每秒百GB, 具备稳定.可靠 ...
- Shell基础(二):Shell中的数值运算、条件测试操作、使用if选择结构
一.Shell中的数值运算 目标: 本案例要求熟悉Linux Shell环境的特点,主要练习以下操作: 1> 使用expr.$[ ].let等整数运算工具:定义变量X=1234,然后计算X与78 ...
- Python 爬取各大代理IP网站(元类封装)
import requests from pyquery import PyQuery as pq base_headers = { 'User-Agent': 'Mozilla/5.0 (Windo ...
- 实现Comparator接口和Comparable接口,以及Map按value排序 ,map遍历
继承Comparator接口,重写compare()方法 import java.util.ArrayList; import java.util.Arrays; import java.util.C ...
- 1. USB协议
1.1 Packets USB总线上数据传输以包为基本单位,一个包含不同的域,但都要从同步域开始,然后跟踪一个包标识符PID(Packet Identifier),最终以包结束符EOP(End of ...
- cesium中divPoint展示数据
cesium中divPoint展示数据 在用点击面获取位置信息的时候,会弹出一个divPoint框,用来展示这个面的属性信息:或者位置信息. 代码如下: var handlerClick = new ...
- JMeter AI图片识别接口并发量测试
由于临时接到一个性能测试任务,测试8个独立接口在实验室环境的TPS.响应时间以及服务器性能监控如CPU.内存.IO等,没有明确具体的响应时间与并发数,需求较模糊. 1.软件.硬件环境信息:JMeter ...
- REST Client实际应用记录
请求Content-Type为application/x-www-form-urlencoded 先来看一个完整示例: ############## ### qa问答 @msg="糖尿病患者 ...
- 实用的CSS3-渐变背景色
线性渐变背景色: 第一个参数为渐变方式,后两个参数为起始点位置和终止点位置,后两个参数为起始颜色和终止颜色,后面那个参数为背景区域padding表示包含padding的区域,content表示 ...