首页 > 其他 > 详细

解决vue 刷新数据丢失的问题

时间:2020-06-06 20:40:24      阅读:39      评论:0      收藏:0      [点我收藏+]

用到的技术

  1. vuex 全局数据
  2. window.addEventListener("beforeunload",()=>{ }) 监听页面刷新
  3. 使用localStorage 临时存储数据

思路:在页面刷新的时候,将vuex中的数据存储到localstorage ,然后刷新结束后再将localstorage里的数赋值给store并清楚localstorage

代码

//js 监听页面alert刷新
    window.addEventListener("beforeunload", () => {
      localStorage.setItem("stateInfo", JSON.stringify(this.$store.state));
    });
    if (localStorage.getItem("stateInfo")) {
      this.$store.replaceState(
        Object.assign(
          {},
          this.$store.state,
          JSON.parse(localStorage.getItem("stateInfo"))
        )
      );
    }

    localStorage.removeItem("stateInfo");
    console.log("名字", this.$store.state);

解决vue 刷新数据丢失的问题

原文:https://www.cnblogs.com/riyueqian/p/13056210.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!