页面刷新vuex数据消失

页面刷新vuex数据消失

vue构建的项目中，vuex的状态存储是响应式的，当vue组件从store中读取状态的时候，若store中的状态发生变化，那么相应的组件也会得到高效刷新，问题来了，vuex存储的数据只是在页面中，相当于我们定义的全局变量，刷新后，里面的数据就会恢复到初始化的状态。比如，用户已经登录，我们把登录状态放到state中了，一刷新页面，还要重新登录？购物车里的添加的数据，一刷新就要重新添加

vuex存取值一般都是放在computed计算属性中，但是一刷新页面的数据就没了

思路：
监听页面是否刷新，如果页面刷新了，将state对象存入到sessionStorage/localStorage中。页面打开之后，判断sessionStorage/localStorage中是否存在state对象，如果存在，则说明页面是被刷新过的，将sessionStorage/localStorage中存的数据取出来给vuex中的state赋值。如果不存在，说明是第一次打开，则取vuex中定义的state初始值

//全局监听，页面刷新的时候将store里state的值存到sessionStorage中，然后从sessionStorage中获取，再赋值给store。然后再把session里面存的删除即可，相当于中间件的作用。
 //在页面加载时读取sessionStorage里的状态信息