问题：

当页面刷新时store的值丢失了。

原因：

当页面刷新时，vue实例重新加载，所以store也会被重置。

解决办法：

监听 beforeunload 让页面在刷新前将数据存到 sessionStorage 中，在页面刷新时，读取 sessionStorage 中的数据到 store 中。

即在app.vue中加入以下代码：

export default {
  name: "App",
  created() {
    let state = sessionStorage.getItem("state");
    if (state) {
      this.$store.replaceState(
        Object.assign(this.$store.state, JSON.parse(state))
      );
      sessionStorage.clear();
    }
  },

  mounted() {
    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("state", JSON.stringify(this.$store.state));
    });
  },
  beforeDestroy() {
    window.removeEventListener("beforeunload");
  }
};

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/6528