vuex store刷新存储状态
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刷新存储状态的更多相关文章
- Vuex 页面刷新后store保存的数据会丢失 取cookie值
在store.js中 export default new vuex.Store({ // 首先声明一个状态 state state:{ pcid: '', postList: [], } //更新状 ...
- 2、vuex页面刷新数据不保留,解决方法(转)
今天这个问题又跟页面的刷新有一定的关系,虽然说跟页面刷新的关系不大,但确实页面刷新引起的这一个问题. 场景: VueX里存储了 this.$store.state.PV这样一个变量,这个变量是在app ...
- vuex页面刷新数据丢失的解决办法
在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例 ...
- vue——store全局存储
业务场景:刷新页面时,首次拉取所有配置,存储到store状态管理用于全局调用: import Vue from 'vue' import Vuex from 'vuex' import userInf ...
- vuex数据持久化存储
想想好还是说下vuex数据的持久化存储吧.依稀还记得在做第一个vue项目时,由于刚刚使用vue,对vue的一些基本概念只是有一个简单的了解.当涉及到非父子组件之间通信时,选择了vuex.只是后来竟然发 ...
- vue 项目中如何在页面刷新的状态下保留数据
1.问题:在vue项目中,刷新页面之后,我当前打开的所有菜单,都消失,我如何实现刷新之后页面仍然是刷新之前的状态 效果图: 解决方法: 使用vuex作状态管理: 将vuex里面的数据同步更新到loca ...
- Do not mutate vuex store state outside mutation handlers.
组件代码: selectItem(item,index) { this.selectPlay({ list: this.songs, index }) }, ...mapActions([ 'sele ...
- 结合sessionStorage解决vuex页面刷新数据丢失的问题
将需要保存在vuex中的数据同时保存在sessionStorage中即可: import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); ...
- [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 ...
随机推荐
- webservice接口测试wsdl,参数是xml格式。python,入参转化成str,返回值转化成dict调用
1.用SoapUI测试webservice接口,传入参数是xml格式时.xml格式需要将xml的外围增加<![CDATA[xml]]> 2.但是用python去做webservice测试, ...
- qmake: could not exec '/usr/lib/x86_64-linux-gnu/qt4/bin/qmake': No such file or directory
执行 qmake -v 出现错误:qmake: could not exec ‘/usr/lib/x86_64-linux-gnu/qt4/bin/qmake’: No such file or di ...
- mysql GROUP_CONCAT 查询某个字段(查询结果默认逗号拼接)
Mysql 的 GROUP_CONCAT 函数默认将查询的结果用逗号拼接并返回一个字符串,如:李四,long,张三 1. 常用方式 select GROUP_CONCAT(user_name) use ...
- nginx修改上传文件大小限制
问题: 项目上线,图片上传报413错误,找了半天,原来是nginx限制了上传大小 在nginx.conf的server的location中加client_max_body_size 10m;
- asp.net中的CheckBox控件的使用
CheckBox控件中的最重要属性就是checked属性了 下面就是使用checked属性的一个小应用; 先建立一个wed窗体:在窗体中写下这些代码: <%@ Page Language=&qu ...
- ASA failover
Active-Standby 1.作用:提供设备冗余 2.物理概念:primary 和 secondary ,需要命令敲得,角色不会切换, 3.虚拟概念:active和standby ,需要选举,角色 ...
- FPGA小例子
AND ---与门:OR --- 或门:INV --- 非门:NAND --- 与非门:NOR --- 或非门:XOR --- 异或门:XNOR ---同或门:MUX --- 数据选择器: 1.使用一 ...
- 2019-04-15 Python之利用matplotlib和numpy的简单绘图
环境:win10家庭版, Anocada的 Spyder 一.简单使用 使用函数 plt.polt(x,y,label,color,width) 根据x,y 数组 绘制直,曲线 import nump ...
- ORACLE——将多行文本数据转换成一行
前几天项目中有个到处文件的功能,但是有一个字段存进的数据存在换行情况,导出来的数据会出现错乱的情况,所以需要把换行的数据转换成一行.当然也可以在java程序中实现. 数据库中的数据为: SQL'; A ...
- 出现error: command 'x86_64-linux-gnu-gcc' failed with exit status 1
查看自己python的版本,然后下载自己版本Python的devel,比如python3.6.8就是 sudo apt-get install python3.6-dev