app.vue

平时不想把信息存到session里,只有无可奈何的时候才准备存

<script>
export default {
name: 'App',
created() {
//刷新不丢失store状态
//在页面加载时,读取sessionStorage里的状态信息
if (sessionStorage.getItem('userinfo')) {
this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem('userinfo'))));
} //在页面刷新时,将vuex里的信息保存到sessionStorage里
window.addEventListener('beforeunload', () => {
sessionStorage.setItem('userinfo', JSON.stringify(this.$store.state));
});
}
};
</script>

vuex store刷新存储状态的更多相关文章

  1. Vuex 页面刷新后store保存的数据会丢失 取cookie值

    在store.js中 export default new vuex.Store({ // 首先声明一个状态 state state:{ pcid: '', postList: [], } //更新状 ...

  2. 2、vuex页面刷新数据不保留,解决方法(转)

    今天这个问题又跟页面的刷新有一定的关系,虽然说跟页面刷新的关系不大,但确实页面刷新引起的这一个问题. 场景: VueX里存储了 this.$store.state.PV这样一个变量,这个变量是在app ...

  3. vuex页面刷新数据丢失的解决办法

    在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例 ...

  4. vue——store全局存储

    业务场景:刷新页面时,首次拉取所有配置,存储到store状态管理用于全局调用: import Vue from 'vue' import Vuex from 'vuex' import userInf ...

  5. vuex数据持久化存储

    想想好还是说下vuex数据的持久化存储吧.依稀还记得在做第一个vue项目时,由于刚刚使用vue,对vue的一些基本概念只是有一个简单的了解.当涉及到非父子组件之间通信时,选择了vuex.只是后来竟然发 ...

  6. vue 项目中如何在页面刷新的状态下保留数据

    1.问题:在vue项目中,刷新页面之后,我当前打开的所有菜单,都消失,我如何实现刷新之后页面仍然是刷新之前的状态 效果图: 解决方法: 使用vuex作状态管理: 将vuex里面的数据同步更新到loca ...

  7. Do not mutate vuex store state outside mutation handlers.

    组件代码: selectItem(item,index) { this.selectPlay({ list: this.songs, index }) }, ...mapActions([ 'sele ...

  8. 结合sessionStorage解决vuex页面刷新数据丢失的问题

    将需要保存在vuex中的数据同时保存在sessionStorage中即可: import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); ...

  9. [Vuex] Split Vuex Store into Modules using TypeScript

    When the Vuex store grows, it can have many mutations, actions and getters, belonging to different c ...

随机推荐

  1. Lecture3.随机变量及其概率分布

    1.随机变量的定义 2.随机变量的类型: 若随机变量X的可能取值是有限个或可列个, 则称X为离散型随机变量. 反之,则称X为非离散型随机变量. 若随机变量X的可能取值“连续”(“不间断”),则称X 为 ...

  2. 【Python全栈-HTML】HTML引入文件的绝对路径、相对路径、根目录

    HTML引入文件的绝对路径.相对路径.根目录 什么是绝对路径?绝对路径指的是文件的真正路径,使用绝对路径链接外部资源,如:图片.超级链接.flash.音频.视频等等.代码如下: 1.引入网络上的资源: ...

  3. node js 爬虫爬取静态页面,

    先打一个简单的通用框子 //根据爬取网页的协议 引入对应的协议, http||https var http = require('https'); //引入cheerio 简单点讲就是node中的jq ...

  4. HDU 2544最短路 【dijkstra 链式前向星+优先队列优化】

    最开始学最短路的时候只会用map二维数组存图,那个时候还不知道这就是矩阵存图,也不懂得效率怎么样 经过几个月的历练再回头看最短路的题, 发现图可以用链式前向星来存, 链式前向星的效率是比较高的.对于查 ...

  5. 爬虫 - 动态分页抓取 游民星空 的资讯 - bs4

    # coding=utf-8 # !/usr/bin/env python ''' author: dangxusheng desc : 动态分页抓取 游民星空 的资讯 date : 2018-08- ...

  6. 在windows上搭建git server Gitblit

    在Windows上搭建Git Server   第1步:下载Java并安装Java.我这里下载的是jdk1.7.0_79 第2步:配置Java环境变量 右键” 计算机” => ”属性” => ...

  7. LigerUi之ligerMenu 右键菜单

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. HRY and codefire

    传送门: 设 dp[i][j]为第一个号i等级,第二个号j等级的期望值 a[i]存每个等级上分的概率 dp[i][j]=a[i]*dp[i+1][j]+(1-a[i])*dp[j][i]+1 dp[j ...

  9. Netflix是怎样运行的(极度简化版)— 每次点击播放按钮背后的复杂东西

    Netflix是怎样运行的(极度简化版)- 每次点击播放按钮背后的复杂东西 本文摘译自 How Netflix works: the (hugely simplified) complex stuff ...

  10. h5样式布局

    在文字的左面加图标  background: url(../images/hi.png) left no-repeat; 如图所示