vuex（状态管理）的作用和常见的问题

vuex（状态管理）的作用和常见的问题

我们都知道状态管理一般用来存储用户登陆的token和用户的id，以便项目全局都可用，但是也会有去缺陷，当页面刷新的时候state中的值会丢失
解决方案：
在app.vue的created方法中读取sessionStorage中的数据存储在store中，此时用vuex.store的replaceState方法，替换store的根状态
在beforeunload方法中将store.state存储到sessionStorage中。

  export default {
      name: 'App',
      created () {
          //在页面加载时读取sessionStorage里的状态信息 
          if (sessionStorage.getItem("store") ) {
              this.$store.replaceState(Object.assign({}, this.$store.state,
JSON.parse(sessionStorage.getItem("store"))))
          } 
          //在页面刷新时将vuex里的state保存到sessionStorage里
          window.addEventListener("beforeunload",()=>{
              sessionStorage.setItem("store",JSON.stringify(this.$store.state))
          })
      }
  }