vuex状态持久化，vuex-persistedstate

什么是Vuex

Vuex是一个专门为vue.js设计的集中式状态管理架构。在data中的属性需要共享给其他vue组件使用的部分，就叫做状态。即data中需要共用的属性。

数据丢失

在使用Vuex的时候只要浏览器一刷新，Vuex数据就丢失，每次还要手动存在本地缓存里面很不方便

vuex-persistedstate

vuex-persistedstate 使用浏览器的本地存储（ local storage ）对状态（ state ）进行持久化。这意味着刷新页面或关闭标签页都不会删除你的数据。

安装

npm install vuex-persistedstate --save-dev

在store文件夹的index.js引入

import VuexPersistence from 'vuex-persistedstate'

初始化vuex 加入插件

const store = new Vuex.Store({
  modules: {
    user,
    groupBuying,
    clearance
  },
  getters,
  plugins: [createPersistedState()]
})

vuex-persistedstate默认用的是localStorage的存储方式，如果需要sessionStorage存储写法如下，如果有其他配置可以参考官方api

plugins: [createPersistedState(
    { storage: window.sessionStorage }
  )]