vuex-persistedstate：刷新页面Store信息不丢

最近开发项目把用户状态丢到vuex里，但刷新页面，会弄丢state影响开发。

我的思路是存入 session 里，改变状态的同时 setItem ，进入页面 getItem，将这两个低级api封装一下，保证容错。 一般情况下 state 的容量很小，sessionStorage 容量肯定是够够的。

同事推荐了一个封装库 vuex-persistedstate

使用简单，不需要侵入代码。比我简单封装容易得很多。项目里就使用了。

使用方式不提，源码稍后阅读。

import Vuex from "vuex";
import createPersistedState from "vuex-persistedstate";
const store = new Vuex.Store({
  // ...
  plugins: [createPersistedState()],
});

大致原理：

• vuex 插件会暴露每次的 mutation 回调，这样插件可以拿到 store的变化
• 将vuex值存入sessionStorage 里

• 源码 https://github.com/robinvdvleuten/vuex-persistedstate