解决vue-admin-template刷新侧边栏数据丢失

news/2024/11/17 5:54:23/

        使用vue-admin-template时,刷新页面侧边栏消失😒,仔细查看代码后找到原因,使用的路由与vuex有关,而在刷新页面时vue会重新加载vue实例,vuex中的数据会被初始化,所以看不到侧边栏是因为数据被重置了。

解决方法:将vuex中的数据直接保存到浏览器缓存中(sessionStorage、localStorage、cookie)页面刷新后再从浏览器中取出。(利用第三方插件)

1.安装vuex-persistedstate

npm install --save vuex-persistedstate

2. 在store/index.js文件中引入(文件结构如下图)

import createPersistedState from 'vuex-persistedstate'

 //替换原先的实例化的store

const store = new Vuex.Store({

    state: {},

    modules,

    getters,

    // 新增规则保存vuex的值

    plugins: [createPersistedState({

        storage: window.sessionStorage

    })]

})

 文件结构图:

index.js文件代码:

 替换后重新编译再次打开后,无论怎么刷新数据都不会丢失😁


http://www.ppmy.cn/news/163717.html

相关文章

把家用的抽油烟机安装在饭店可以吗?

近来,很多小伙伴都在问,“要怎么去饭店的油烟呢?”把家里用的抽油烟机安装到店里可以吗?。但事实上,“抽油烟机”还是远远不够的,必须安装油烟净化器去净化处理油烟! 今天小编就为大家介绍一下油…

c语言四舍五入保留小数

c语言四舍五入保留小数 #include<stdio.h>int main() {double sum 0.0;scanf("%lf",&sum);sum (sum*1005)/100.0;printf("%.1lf\n",sum);return 0; }精华在第7行&#xff0c; 举个例子吧&#xff0c; eq&#xff1a;sum 3.6589 sum sum*100…

油烟净化器和抽油烟机是同一种设备吗?

在关于厨房油烟方面&#xff0c;对于不是从事餐饮行业的来说&#xff0c;很多人首先想到的就是抽油烟机&#xff0c;毕竟当今对于厨房环境和健康的重视&#xff0c;大部分家庭厨房都安装了抽油烟机&#xff0c;但是很多人就疑惑了&#xff0c;抽油烟机和油烟净化器是同一种设备…

更智能的烟灶套装,让厨房免受油烟困扰,云米AI油烟机Wing A1体验

这两年智能家电发展的很快,我之前也用过几款,像是冰箱、洗碗机之类的,用起来确实比普通的家电方便,而且很多国产的智能家电品牌还会针对国内用户的使用习惯做出不少优化。前些天为了能让厨房更加干净一些,新装了一款云米AI油烟机Wing A1,这两天试过之后,感觉用起来确实不…

【C语言】计算器

&#x1f680;write in front&#x1f680; &#x1f50e;大家好&#xff0c;我是謓泽&#xff0c;希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流&#x1f50e; &#x1f3c5;2021年度博客之星物联网与嵌入式开发TOP5&#xff5e;2…

“集成”革命下,华帝、方太的理想之路

四方食事&#xff0c;不过一碗人间烟 火。在快节奏的如今&#xff0c;留得空闲下厨似乎已经成为了生活中的“奢 侈”。而今&#xff0c;厨房电器市场的“集成”革命正在逐步填补这些硬件缺口&#xff0c;让大家都能在厨房这方天地中拥有属于自己独一无二的人间烟 火。 所谓厨房…

计算器——位运算(c语言)

目录 前言 一、位运算是什么 二、实现位运算计算器 1.加法 2、减法 三、乘法 4、除法 总结 前言 对于计算器&#xff0c;可能很多同学都会写&#xff0c;毕竟那是最基础的东西&#xff0c;那今天我来介绍个不那么基础的计算器。记住不要出现 - * /&#xff0c;我们的宗旨是&am…

华帝i11010吸油烟机怎么样?

华帝&#xff08;VATTI&#xff09;i11010是一个不错的选择&#xff0c;怎么样呢&#xff1f;不锈钢侧吸烟机是一个不错的选择&#xff0c;怎么样呢&#xff1f;金属银网上买吸油烟机绝对超值&#xff0c;但是 杂志采访让人放心的客人^没有把这好点子瞎扯淡多听听顾客没有上班了…