vue 刷新保存数据_vuex数据何时清除

vue 刷新保存数据_vuex数据何时清除在项目中我们通常会遇到这样一个情况,客户不允许把信息存储在sessionStorage/localStorage因为这样会暴露一些存储信息,安全起见只能存储在vuex里面,但是vuex刷新之后state里面的信息依旧会被清除,我们的思路是刷新之前把所有的数据存储在localStorage里面,刷新后取出里面的数据,并清除local/session里面的记录,这种全局的我们可以放在app.vue里面,下面是代码实现//app.vuecreated(){//在页面

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

在项目中我们通常会遇到这样一个情况,客户不允许把信息存储在 sessionStorage / localStorage 因为这样会暴露一些存储信息,安全起见只能存储在 vuex 里面,但是 vuex 刷新之后 state 里面的信息依旧会被清除,我们的思路是刷新之前把所有的数据存储在 localStorage 里面,刷新后取出里面的数据,并清除 local/session 里面的记录,这种全局的我们可以放在 app.vue 里面,下面是代码实现

// app.vue
created(){ 
   
    //在页面刷新时将vuex里的信息保存到localStorage里
    window.addEventListener("beforeunload",()=>{ 
   
      localStorage.setItem("userComMsg",JSON.stringify(this.$store.state))
    });

    //在页面加载时读取localStorage里的状态信息
    if(localStorage.getItem("userComMsg")){ 
   
      Object.assign(this.$store.state,JSON.parse(localStorage.getItem("userComMsg")));
      //使用后清除内存
      setTimeout(function () { 
   
        localStorage.removeItem("userComMsg");
      },300)
    }
  }
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/181327.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Java 链表结点插入

    Java 链表结点插入PS:链表是一种数据结构,而数据结构就是一种存放数据的方式。为什么需要链表?我们知道,数组也可以存储数据,那么为什么还需要链表呢?接下来,我们来看看数组和链表的区别:1、数组就像身上编了号站成一排的人,要找第10个人很容易,根据人身上的编号很快就能找到。但插入、删除慢,要往某个位置插入或删除一个人时,后面的人身上的编号都要变。当然,加入或删除的人始终末尾的也快。2、链表就…

    2022年4月30日
    42
  • python七夕表白代码(转载)_2019年倒计时日历

    python七夕表白代码(转载)_2019年倒计时日历520即将来袭~普通人表白,发微信买花程序员表白,用代码给女神画玫瑰,画爱心无线弹窗表白,网页无线弹窗表白第一种:心连心fromturtleimport*color(“black”,”red”)pensize(5)begin_fill()penup()goto(50,50)pendown()right(45)goto(100,0)left(90)fd(120)circle(50,225)penup()goto(0,0)pendown()left(13..

    2022年10月14日
    4
  • 晶体管 开关电路_pnp开关电路

    晶体管 开关电路_pnp开关电路数字电路有两种,流控和压控晶体管作为开关时,就是用了它的“截止”和“饱和”两个状态。CPU中的逻辑开关电路,原理上不是电流来控制的,而是(不准确的说是)电压来控制的,准确的说叫电场来控制的,只要电场在,零电流也能保持打开或关闭,这种晶体管开关叫MOSFET(金属氧化物半导体场效晶体管Metal-Oxide-SemiconductorField-EffectTransistor),特别的…

    2025年12月6日
    5
  • 电路的kvl方程_电路分析依据两类约束

    电路的kvl方程_电路分析依据两类约束1.2b方程2.举例举例2

    2022年8月1日
    4
  • pycharm 激活code 2022【最新永久激活】

    (pycharm 激活code 2022)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~1…

    2022年3月31日
    586
  • debussy 使用

    debussy 使用modelsim 是 windows 比较常用的仿真工具 虽然编译没有 VCS 快 但是比较方便 但是调适能力却比不 debussy 而 debussy 没有编译能力 所有一般设计者在 windows 下习惯使用 modelsim debussy 本文将详细介绍 Modelsim debussy 调试基本步骤 Modelsim 阶段 a 将 debussy 安装目录下的 share PLI modelsim fl

    2026年1月17日
    1

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号