解决 Vue 刷新页面后 store 数据丢失的问题
原来的状态(页面刷新数据会重置)
state: {
teamA: '主队'
},
mutations: {
data_teamA(state, x) {
state.teamA = x
}
},
解决后(页面刷新保留store数据)
state: {
teamA: JSON.parse(sessionStorage.getItem("teamA")) || '主队'
},
mutations: {
data_teamA(state, x) {
sessionStorage.setItem('teamA', JSON.stringify(x))
state.teamA = x
}
},
解决 Vue 刷新页面后 store 数据丢失的问题的更多相关文章
- 解决vue刷新页面以后丢失store的数据
刷新页面时vue实例重新加载,store就会被重置,可以把定义刷新前把store存入本地localStorage.sessionStorage.cookie中,localStorage是永久储存,重新 ...
- 解决Vuex持久化插件-在F5刷新页面后数据不见的问题
页面刷新后,想保存页面未保存的数据.我们总是习惯于放在浏览器的sessionStorage和localStorage中.但是用了vue后,vuex便可以被应用了. vuex优势:相比sessionSt ...
- vue 页面间使用路由传参数,刷新页面后获取不到参数的问题
情况 情况再简单说明一下: 有三个页面(a-列表页面,b-内页1,c-内页2),页面a->页面b->页面c有参数传递.从a进入b后,刷新b页面拿不到a页面传进来的参数.或者b页面再进入c页 ...
- Vue刷新页面VueX中数据清空了,怎么重新获取?
Vue刷新页面VueX数据清空了,怎么重新获取? 点击打开视频讲解更详细 在vue中刷新页面后,vuex中的数据就没有了,这时我们要想使用就要重新获取数据了, 怎么在刷新后重新获取数据呢??? 这时我 ...
- selected 刷新页面后selected选中的值保持不表(thinkphp 从控制器assign 传值到js)
昨晚解决select 刷新页面以后选择的值保持不变,要想让seleted不变,有两种思路, 1,在提交表单的时候,将所选择的option的属性设为checked . 2.将option的value或者 ...
- 解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题
解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题: <style> [v-cloak]{ display: none; } </style> <div id=& ...
- 刷新页面后,让控制台的js代码继续执行
在各种限时,秒杀活动中,有个自动循环的点击的工具是很重要的. 为了方便起见,我们把Js代码放在浏览器的控制台执行,但是刷新页面后,js代码就清空了,也就无法执行. 可以用js代码实现一个不受页面刷新影 ...
- JS利用cookie记录当前位置实现刷新页面后还可以保持菜单栏的展开或闭合
代码如下,重点是JS部分的代码(部分样式引用的是Bootstrapt中的): <style> .sidebar-menu .special{ font-size: 16px; marg ...
- 解决刷新页面vuex store中数据丢失的问题
**问题背景:**页面刷新后,vuex中的数据丢失.这是因为:js代码是运行在内存中的,代码运行时的所有变量.函数也都是保存在内存中的.进行刷新页面的操作,以前申请的内存被释放,重新加载脚本代码,变量 ...
随机推荐
- Appium基础之屏幕截图
应用背景 在实际自动化项目运行过程中,很多时候App可以会出现各种异常,为了更好的定位问题,除了捕捉日志我们还需要对运行时的设备状态来进行截屏.从而达到一种“有图有真相”的效果. 截图方法 方法1 s ...
- SQL Server PARTITION FUNCTION(分区)
分区并不影响Linq,sql查询 在MSSQL中,选中目标表,右键-存储-创建分区 根据提示完成分区,存储成sql 这里展示如何根据Id的数据范围分区 在执行前,可能需要设置日志文件大小为" ...
- Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证
一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...
- linux中C语言的运行(gcc)
执行sudo apt-get install build-essential 出现
- IntelliJ IDEA 常用快捷键 之 Windows 版
IntelliJ IDEA(简称 IDEA),是 Java 语言开发的集成环境,IDEA 在业界被公认为最好的 Java 开发工具之一,尤其在智能代码助手.代码自动提示.重构.J2EE 支持.各类版本 ...
- 手撕面试官系列(四 ):MongoDB+Redis 面试专题
MongoDB (面试题+答案领取方式见侧边栏) 你说的 NoSQL 数据库是什么意思?NoSQL 与 RDBMS 直接有什么区别?为什么要使用和不使用NoSQL 数据库?说一说 NoSQL 数据 ...
- JQuery高级(二)
3. 事件绑定 1. jquery标准的绑定方式 * jq对象.事件方法(回调函数): * 注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为. * 表单对象.submit();//让表单提 ...
- redis的redisvCommand的%b
如下代码,向redis发送命令 SendCommand("HSET %b %b %b",key.data(),key.size(),filed.data(),filed.size( ...
- Python之路【第二十篇】:python项目之旧版抽屉新热榜
旧版抽屉新热榜 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- AVR单片机教程——数码管
先解答之前一个思考题:如果不把引脚配置为输出而写高电平,连接LED会怎样? 实验结果是,LED会亮,但相比于输出高电平的情况,亮度很低.这是为什么呢? 通过上一篇教程我们知道,引脚输入输出模式是由寄存 ...