npm安装vuex及防止页面刷新数据丢失
npm install vuex
在项目scr目录下新建store文件夹,在store文件夹下新建index.js文件。
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex); const state={
accountInfo:{ }
} const mutations={
initUser(state,payload){
state.accountInfo=Object.assign(state.accountInfo,payload);
localStorage.setItem('accountInfo',JSON.stringify(state.accountInfo));
},
clear(state){
state.accountInfo={ }
}
}
//防止页面刷新vuex中的数据丢失
for(var item in state){
localStorage.getItem(item)?state[item] = JSON.parse(localStorage.getItem(item)): false;
} export default new Vuex.Store({
state,
mutations
})
npm安装vuex及防止页面刷新数据丢失的更多相关文章
- vuex页面刷新数据丢失的解决办法
在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例 ...
- 结合sessionStorage解决vuex页面刷新数据丢失的问题
将需要保存在vuex中的数据同时保存在sessionStorage中即可: import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); ...
- vue传参页面刷新数据丢失问题
在做vue的时候,经常会遇到组件之间数据的传递问题,通过params或者query传参,但是,当页面刷新的时候,数据会丢失,找不到数据.今天经过总结,解决了这个问题.通过了一下几种情况进行传值: 通过 ...
- vue页面刷新数据丢失问题
参考: https://blog.csdn.net/aliven1/article/details/80743470 https://blog.csdn.net/liang37712 ...
- vue案例 - vuex+sessionstorage解决vue项目刷新后页面空白/数据丢失
第一部分 SessionStorage 首先查看sessionStorage的地方在控制台的 Application > Storage > Session Storage这里: 根据se ...
- 2、vuex页面刷新数据不保留,解决方法(转)
今天这个问题又跟页面的刷新有一定的关系,虽然说跟页面刷新的关系不大,但确实页面刷新引起的这一个问题. 场景: VueX里存储了 this.$store.state.PV这样一个变量,这个变量是在app ...
- Vuex数据页面刷新丢失问题解决方案
用Vue做项目开发很久了,对于vuex能用.会用,但是因为状态脱离页面和刷新丢失两个原因,一直都有种抵触,特别是一些简单的数据都是通过query或者本地存储就解决了,然而对于一些复杂内容,不可避免的还 ...
- 解决vuex保存的数据刷新页面时清空
参考文章: vuex中store保存的数据,刷新页面会清空 主要解决代码: 1.更改store文件下index文件state的定义 const store = new Vuex.Store({ sta ...
- 页面刷新vuex数据消失问题解决方案
VBox持续进行中,哀家苦啊,有没有谁给个star. vuex是vue用于数据存储的,和redux充当同样的角色. 最近在VBox开发的时候遇到的问题,页面刷新或者关闭浏览器再次打开的时候数据归零.这 ...
随机推荐
- Android源码的git下载地址
git clone https://android.googlesource.com/device/common.git git clone https://android.googlesour ...
- spark在collect收集数据的时候出现outOfMemoryError:java heap space
spark的collect是action算子,所有最后会以数组的形式返回给driver端,当数据太大的时候就会出现堆内存溢出.OutofMemoryError:java heap space. 在sp ...
- NOIp2018集训test-9-22(am/pm) (联考三day1/day2)
szzq学长出的题,先orz一下. day1 倾斜的线 做过差不多的题,写在我自己的博客里,我却忘得一干二净,反而李巨记得清清楚楚我写了的. 题目就是要最小化这个东西 $|\frac{y_i-y_j} ...
- MTT:任意模数NTT
MTT:任意模数NTT 概述 有时我们用FFT处理的数据很大,而模数可以分解为\(a\cdot 2^k+1\)的形式.次数用FFT精度不够,用NTT又找不到足够大的模数,于是MTT就应运而生了. MT ...
- NX二次开发-NX11创建表达式组NXOpen::ExpressionGroup
NX11+VS2013 #include <uf.h> #include <uf_modl.h> #include <uf_part.h> #include < ...
- 黑科技之杜教bm
这个板子能够解决任何线性递推式,只要你确定某个数列的某项只与前几项线性相关,那么把它前若干项丢进去,这个板子就能给你返回你要求的某项的值. 原理???(待补充) #include<bits/st ...
- Java io简单总结
IO 字节流在操作时本身不会用到缓冲区(内存),是文件本身直接操作的 字符流在操作时使用了缓冲区,通过缓冲区再操作文件 缓冲:一段特殊的内存.如果一个程序频繁地操作一个资源(如文件或数据库),则性能会 ...
- [转]C# JSON格式的字符串读取到类中
将JSON格式的字符串读取到类中 本例中建立JSON格式的字符串json,将其内容读取到Person类中 运行本代码需要添加引用动态库Newtonsoft.Json 程序代码: using Syste ...
- [转]C# 将类的内容写成JSON格式的字符串
将类的内容写入到JSON格式的字符串中 本例中建立了Person类,赋值后将类中内容写入到字符串中 运行本代码需要添加引用动态库Newtonsoft.Json 程序代码: using System; ...
- 新建的maven项目里没有src
百度上搜到一个网友的一句话:没筷子你就不吃饭了是吧 若有所思 自己新建一个src文件 然后, 由于已经转换,因此上图没有sources选项 然后就可以在文件中随意编写文件 如果想添加package,直 ...