原来的状态(页面刷新数据会重置)

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 数据丢失的问题的更多相关文章

  1. 解决vue刷新页面以后丢失store的数据

    刷新页面时vue实例重新加载,store就会被重置,可以把定义刷新前把store存入本地localStorage.sessionStorage.cookie中,localStorage是永久储存,重新 ...

  2. 解决Vuex持久化插件-在F5刷新页面后数据不见的问题

    页面刷新后,想保存页面未保存的数据.我们总是习惯于放在浏览器的sessionStorage和localStorage中.但是用了vue后,vuex便可以被应用了. vuex优势:相比sessionSt ...

  3. vue 页面间使用路由传参数,刷新页面后获取不到参数的问题

    情况 情况再简单说明一下: 有三个页面(a-列表页面,b-内页1,c-内页2),页面a->页面b->页面c有参数传递.从a进入b后,刷新b页面拿不到a页面传进来的参数.或者b页面再进入c页 ...

  4. Vue刷新页面VueX中数据清空了,怎么重新获取?

    Vue刷新页面VueX数据清空了,怎么重新获取? 点击打开视频讲解更详细 在vue中刷新页面后,vuex中的数据就没有了,这时我们要想使用就要重新获取数据了, 怎么在刷新后重新获取数据呢??? 这时我 ...

  5. selected 刷新页面后selected选中的值保持不表(thinkphp 从控制器assign 传值到js)

    昨晚解决select 刷新页面以后选择的值保持不变,要想让seleted不变,有两种思路, 1,在提交表单的时候,将所选择的option的属性设为checked . 2.将option的value或者 ...

  6. 解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题

    解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题: <style> [v-cloak]{ display: none; } </style> <div id=& ...

  7. 刷新页面后,让控制台的js代码继续执行

    在各种限时,秒杀活动中,有个自动循环的点击的工具是很重要的. 为了方便起见,我们把Js代码放在浏览器的控制台执行,但是刷新页面后,js代码就清空了,也就无法执行. 可以用js代码实现一个不受页面刷新影 ...

  8. JS利用cookie记录当前位置实现刷新页面后还可以保持菜单栏的展开或闭合

    代码如下,重点是JS部分的代码(部分样式引用的是Bootstrapt中的):   <style> .sidebar-menu .special{ font-size: 16px; marg ...

  9. 解决刷新页面vuex store中数据丢失的问题

    **问题背景:**页面刷新后,vuex中的数据丢失.这是因为:js代码是运行在内存中的,代码运行时的所有变量.函数也都是保存在内存中的.进行刷新页面的操作,以前申请的内存被释放,重新加载脚本代码,变量 ...

随机推荐

  1. Linux磁盘空间查看、磁盘被未知资源耗尽

    Linux系统中,当我们使用rm在Linux上删除了大文件,但是如果有进程打开了这个大文件,却没有关闭这个文件的句柄, 那么Linux内核还是不会释放这个文件的磁盘空间,最后造成磁盘空间占用100%, ...

  2. JavaScript 有用的代码片段和 trick

    浮点数取整 const x = 123.4545; x >> 0; // 123 ~~x; // 123 x | 0; // 123 Math.floor(x); // 123 注意:前三 ...

  3. springboot自定义类@Resource注入为null的问题

    最近用spring boot ,在controller外面即自定义的类里报错 java.lang.NullPointerException debug了下发现@Resource注入为null 查了不少 ...

  4. [转载]ROS开发环境之Qt Creator

    ROS开发环境之Qt Creator(http://my.phirobot.com/blog/2013-12-ros_ide_qtcreator.html) Created at: 2013-12-2 ...

  5. netty例子-客户端每隔5秒发送查询时间的请求,服务器端响应请求

    netty是jboss公司开发的,基于异步的.事件驱动的网络应用程序框架,快速开发高性能.高可靠性的服务器和客户端程序 public class TimeServer { ; public void ...

  6. Django使用distinct报错:DISTINCT ON fields is not supported by this database backend

    具体错误提示是:django.db.utils.NotSupportedError: DISTINCT ON fields is not supported by this database back ...

  7. (1)ASP.NET Core 应用启动Startup类简介

    1.前言 Core与早期版本的 ASP.NET 对比,配置应用程序的方式的 Global.asax.FilterConfig.cs和RouteConfig.cs 都被Program.cs 和 Star ...

  8. Redis AOF持久化(二)

    1.AOF持久化的配置 AOF持久化,默认是关闭的,默认是打开RDB持久化 appendonly yes,可以打开AOF持久化机制,在生产环境里面,一般来说AOF都是要打开的,除非你说随便丢个几分钟的 ...

  9. Deploy custom service on non hadoop node with Apache Ambari

    1   I want to deploy a custom service onto non hadoop nodes using Apache Ambari. I have created a cu ...

  10. 使用 Create-React-App 开发 Chrome 扩展

    整理 Kindle 标注.书签和笔记从未如此简单! Kindle 标注管理应用 Kindle Mate 只支持 Windows,不支持 Mac.标注只是解析我的剪贴文本文件,配合 FileReader ...