Vuex信息刷新保存

前言
        vuex状态管理，作用相当于静态变量，所有页面和组件都能够获取vuex数据。在使用得时候，页面刷新时，保存在vuex的数据会全部清除掉，这是我们不希望的。
        解决方案就是将信息绑定到sessionStorage里，产生这个问题的原因就是store的数据是保存在运行内存当中的，当页面刷新时，页面会重新加载vue实例，store里面的数据就会被重新赋值。
        为了防止这种信息消失，我们可以把信息保存在session里，数据储存到当前页面关闭为止。

思路：

        方案一：由于state的数据是相应式，所以sessionStorage储存也要跟随变化。又由于vuex规定所有的state里数据必须通过mutation方法来修改，所以第一种方案就是mutation修改state的同时修改sessionStorage对应存储的属性。
        方案二：第一种意思其实是每此修改state的同时也要修改sessionStorage，这样太麻烦，换个思路，因为我们是只有刷新页面时才会丢失state里的数据，那就应该有办法在点击刷新页面时先将state数据保存到sessionStorage，然后才真正刷新页面。我们可以把这个触发条件放到App.vue里，这样就可以保证每次刷新页面都可以触发。参考储存器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里的信息保存到sessionStorage里
      window.addEventListener("beforeunload",()=>{
        sessionStorage.setItem("store",JSON.stringify(this.$store.state))
      })
    },
}