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开发的时候遇到的问题,页面刷新或者关闭浏览器再次打开的时候数据归零.这 ...
 
随机推荐
- wordpress翻译插件gtranslate
			
https://www.gdstautoparts.com/
 - spring5.02版快速入门
			
spring5.02版快速入门分为以下 四步, 1. 引入依赖 2. 创建beans.xml配置文件 3 创建相应的接口实现类(仅仅是快速创建,实现类不给任何方法) 4. 创建容器对象,根据id获取对 ...
 - 【SPOJ DQUERY】区间数字统计
			
[链接] 我是链接,点我呀:) [题意] 题意 [题解] 因为区间的端点移动一个单位的话,只会涉及到一个元素的增多或减少. 因此可以用莫队算法来解决. 只需要开一个数组(大小1百万),用下标来快速检索 ...
 - NX二次开发-UFUN计时函数UF_begin_timer
			
NX9+VS2012 #include <uf.h> #include <uf_modl.h> UF_initialize(); //计时开始 UF_timer_t Timer ...
 - hdu多校第七场 1011 (hdu6656) Kejin Player 概率dp
			
题意: 一个游戏,有许多关,到下一关要花费金钱,做出尝试,有概率成功,若成功则到达下一关,若失败则停在此关或退回到前面某关,询问第l关到第r关的期望费用 题解: 显然,第r关到第l关的费用是dp[r] ...
 - 黑科技之杜教bm
			
这个板子能够解决任何线性递推式,只要你确定某个数列的某项只与前几项线性相关,那么把它前若干项丢进去,这个板子就能给你返回你要求的某项的值. 原理???(待补充) #include<bits/st ...
 - MongoDB点滴
			
0 http://blog.csdn.net/mydeman/article/details/6652387 1 MongoDB 内置连接池,不需要使用额外的连接池驱动 Note: The Mongo ...
 - scala实现读取Oracle数据
			
用scala实现读取oracle数据 增加oralce的jar包后 package cn.bigdata.scala.oracle import java.sql.{DriverManager, Co ...
 - 【POJ】1797 Heavy Transportation
			
题目链接:http://poj.org/problem?id=1797 题意:n个城镇,m条路上能承载的最大重量.现在问你从1到n的最大承重量. 题解:spfa的变体. 假设当前1->当前点的承 ...
 - Linux 实用指令(9)--进程管理
			
目录 进程管理 1 进程的基本介绍 2 显示系统执行的进程 2.1 说明: 2.2 ps指令详解 2.3 应用实例 3 终止进程kill和killall 3.1 介绍 3.2 基本语法 3.3 常用选 ...