created () {
this.$store.replaceState(Object.assign(this.$store.state,JSON.parse(localStorage.getItem("beforeunload"))));
window.addEventListener('beforeunload', ()=>{
let state = JSON.stringify(this.$store.state)
localStorage.setItem("beforeunload",state);
});
},

在created 生命周期中 保存数据 和同步数据

vue 使用vuex 刷新时保存数据的更多相关文章

  1. 十、Vue:Vuex实现data(){}内数据多个组件间共享

    一.概述 官方文档:https://vuex.vuejs.org/zh/installation.html 1.1vuex有什么用 Vuex:实现data(){}内数据多个组件间共享一种解决方案(类似 ...

  2. vue 浏览器页面刷新时执行一段代码

    当刷新(浏览器刷新)页面的时候,重置到首页(或其他页面)纯js的是window.onload()但是vue几乎不会用到这个,vue所有的是生命周期那么我们可以根据生命周期来实现这个beforeCrea ...

  3. Vuex 刷新后数据丢失问题 Typescript

    问题描述:Vuex保存的数据在页面刷新后会全部丢失清除 问题解决方案:使用sessionstorage进行保存,在页面刷新时保存至sessionStorage,页面在加载时再进行填充   (另有vue ...

  4. vue常见问题处理 -- 页面刷新时,如何保持原有vuex中的state信息

    一.页面刷新时,如何保持原有vuex中的state信息 页面刷新后,原有的 vuex 中的 state 会发生改变,如果在页面刷新之前,可以将 state 信息保存,页面重新加载时,再将该值赋给 st ...

  5. vuex中store保存的数据,刷新页面会清空

    用vuex,项目中需要记录一些状态,来判断页面是否为登录状态和页面是否可被编辑,此时用到了vuex中的store来存储一个状态. //首先 安装vuex npm install vuex --save ...

  6. 解决Vuex刷新页面数据丢失问题 ---- vuex-persistedstate持久化数据

    何为Vuex?用处是什么?为什么刷新丢失? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化 ...

  7. 10.解决VUEX刷新的时候出现数据消失

    通常,我们在使用vue编写页面时,会需要使用vuex在组件间传递(或者说共同响应)同一个数据的变化.例如:用户的登录信息. 下面,我们使用传递用户登录信息的例子来一步步解决这个问题. 首先,我们的第一 ...

  8. vuex 实现vue中多个组件之间数据同步以及数据共享。

    http://pan.baidu.com/s/1hrJfpli  demo下载地址 前言 在一些项目中有很多数据状态之间要实现数据共享状态共享,例如购物车的数据.用户的登录状态等等.vue父元素是可以 ...

  9. vue中前进刷新、后退缓存用户浏览数据和浏览位置的实践

    vue中前进刷新.后退缓存用户浏览数据和浏览位置的实践 2018年07月07日 11:58:40 大灰狼的小绵羊哥哥 阅读数:4492   vue中,我们所要实现的一个场景就是: 1.搜索页面==&g ...

随机推荐

  1. HDU6623 Minimal Power of Prime (简单数论)

    题面 T ≤ 50   000 T\leq50\,000 T≤50000 组数据: 输入一个数 N N N ( 2 ≤ N ≤ 1 0 18 2\leq N\leq 10^{18} 2≤N≤1018) ...

  2. Mac系统下Datagrip打不开、点击没反应?

    有没有可能是因为你从网上下载了一些破解软件导致的? 背景 Mac系统下JB公司家的IDEA. Datagrip.PyCharm 或 Goland 打不开点击没反应-- 分析 大概率是之前安装过 汉化插 ...

  3. 02_Django-路由配置-HTTP协议的请求和响应

    02_Django-路由配置-HTTP协议的请求和响应 视频:https://www.bilibili.com/video/BV1vK4y1o7jH 博客:https://blog.csdn.net/ ...

  4. KingbaseES R6 集群备库网卡down测试案例

    数据库版本: test=# select version(); version ------------------------------------------------------------ ...

  5. Group 和 Distinct 列的次序影响查询性能

    目录 一.概述 二.work_mem 满足排序情况 1.Distinct 语句 2.Group by 语句 三.work_mem 不满足排序情况 1.Distinct 语句 2.Group by 语句 ...

  6. KingbaseES R6 单节点数据库异机恢复案例

    数据库运行硬件或系统环境如果发生了不可恢复的故障,这时只能采用异机恢复的方式恢复数据库.以下通过例子介绍异机恢复的过程. 一.硬件环境 192.168.237.101 数据库运行源主机 192.168 ...

  7. 【金九银十必问面试题】站在架构师角度分析问题,如何解决TCC中的悬挂问题

    "如何解决TCC中的悬挂问题"! 一个工作了4年的Java程序员,去京东面试,被问到这个问题. 大家好,我是Mic,一个工作了14年的Java程序员 这个问题面试官想考察什么方面的 ...

  8. 对表白墙wxss的解释

    一.index.wxss 1 /* 信息 */ 2 .Xinxi{ 3 display: flex; 4 flex-wrap: wrap; 5 margin: 0rpx 1%; 6 } 7 8 9 / ...

  9. Java---Stream进阶

    由于本文需要有一定的Stream基础,所以如果不懂什么是Stream的同学请移步:Java---Stream入门 操作分类 graph LR 操作分类 --- 中间操作 终端操作 --- 操作分类 中 ...

  10. 餐饮行业SRM案例:方正璞华"采云链"携手和府捞面

    ​ 方正璞华在与和府捞面的项目中,帮助整合采购系统,系统化管理供应商,优化采购流程和数据分析,建立储备知识库. 项目背景 企业介绍 ◇ 和府捞面成立于2012年,是国内中式面食头部品牌.自2013年首 ...