vuex防止数据刷新数据刷掉
replaceState
replaceState(state: Object)
替换store的根状态,仅用状态合并或者时光旅行调试
// 在页面加载时读取localStorage里的状态信息
if (localStorage.getItem('store')) {
this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(localStorage.getItem('store'))))
} // 在页面刷新时将vuex里的信息保存到localStorage里
window.addEventListener('beforeunload', () => {
localStorage.setItem('store', JSON.stringify(this.$store.state))
})
vuex防止数据刷新数据刷掉的更多相关文章
- 如何解决vuex因浏览器刷新数据消失,保持数据持久化问题?
vuex的一个全局状态管理的插件,但是在浏览器刷新的时候,内存中的state会释放.通常的解决办法就是用本地存储的方式保存数据,然后再vuex初始化的时候再赋值给state,此过程有点麻烦.因此可以使 ...
- vue路由参数变化刷新数据
当路由到某个组件时,由于组件会复用,所以生命周期函数不会再次执行, 如果这个组件是模板组件,靠传入不同数据来显示的.那么,可能会发生参数变化了但页面数据却不变化. 问题 假如有个组件 info.vue ...
- 使用sessionStorage解决vuex在页面刷新后数据被清除的问题
https://www.jb51.net/article/138218.htm 1.原因 2.解决方法 localStorage没有时间期限,除非将它移除,sessionStorage即会话,当浏览器 ...
- 解决vuex的数据刷新(F5)后会被初始化的问题
介绍一个vuex的数据刷新(F5)后会被初始化的问题处理的插件:vuex-localstorage 实现的原理大概就是监听浏览器的刷新,关闭事件,把vuex的值存储到本地localstorage,刷新 ...
- BEX5下增加sessionStorage监听器实现页面间数据刷新
场景: A页面修改了数据,希望B页面能进行及时的同步前端数据,但是假如当A页面修改保存后,去获得B页面的model对象,会增加开发的难度,同时A页面也不能重复利用:假如在B页面的激活事件里面写刷新代码 ...
- SQL实现类似于自动刷新数据的功能
有时需要在SQL中,定时刷新某张表,比如说是要定时查询某张表的行数,通常做法就是手动的按F5去执行来刷新数据.但是如果这个定时查询历时较长,10分钟,或半小时,手动的话肯定是要崩溃了.貌似SQL没有像 ...
- jsTree 的简单用法--异步加载和刷新数据
首先这两个文件是必须要引用的,还有就是引用 jQuery 文件就不说了: <link href="/css/plugins/jsTree/style.min.css" rel ...
- iOS - UIRefreshControl 刷新数据
前言 NS_CLASS_AVAILABLE_IOS(6_0) __TVOS_PROHIBITED @interface UIRefreshControl : UIControl 1.UIRefresh ...
- 解决JQuery中datatables设置隐藏显示列多次提交后台刷新数据的问题
此次项目开发过程中用到了Jquery的Datatables插件,无疑他是数据列表展示,解决MVC中同步过程中先走控制器后返回视图,查询数据过程中无法提示等待的弊端, 而且他所提供的各种方法也都有较强的 ...
随机推荐
- IAP15W4K58S4引脚定义 STC15
- CocoPods原理
CocoaPods 的原理是将所有的依赖库都放到另一个名为Pods的项目中, 然而让住项目依赖Pods项目, 这样,源码管理工作任务从主项目移到了Pods项目中. 1.Pods项目最终会编译成一个名为 ...
- [b0001] 伪分布式 hadoop 2.6.4
说明: 任务:搭建Hadoop伪分布式版本. 目的:快速搭建一个学习环境,跳过这一环境,快速进入状态,使用Hadoop一些组件做些任务 没有选择2.7,觉得bug比较多,不稳定. 选择伪分布式简单快速 ...
- 6.python3实用编程技巧进阶(一)
1.1.如何在列表中根据条件筛选数据 # 1.1.如何在列表中根据条件筛选数据 data = [-1, 2, 3, -4, 5] #筛选出data列表中大于等于零的数据 #第一种方法,不推荐 res1 ...
- 微信小程序之 catalog 切换
组件名称:catalog 组件属性:catalogData,type:String 组件描述:这是一个子组件,数据从父组件中传递 效果图: catalog 目录为多个,使用 scroll-view 容 ...
- weblogic(一).简介与安装
weblogic(一).简介与安装 WebLogic是美国Oracle公司出品的一个application server,确切的说是一个基于JAVAEE架构的中间件,WebLogic是用于开发.集 ...
- 四,专著研读(K-近邻算法)
四,专著研读(K-近邻算法) K-近邻算法有监督学习距离类模型, k-近邻算法步骤 计算已知类别数据集中的点与当前点之间的距离 按照距离递增的次序进行排序 选取与当前点距离最小的K个点 确定前k个点出 ...
- angular父子组件传值和ngOnChanges的使用
父组件中定义: public detailbaseinfo = {}; //详情基本信息 其中detailbaseinfo 数据会通过请求获取 父组件传值给子组件如下: 子组件接收父组件传值 imp ...
- ES6-Symbol.iterator 迭代器
一个数据结构只要部署了Symbol.iterator属性就能使用 for...of遍历 与 ...运算符 操作 Object身上没有Symbol.iterator,当直接使用时会报错 let obj ...
- LeetCode 61:旋转链表 Rotate List
给定一个链表,旋转链表,将链表每个节点向右移动 k 个位置,其中 k 是非负数. Given a linked list, rotate the list to the right by k pla ...