使用Vuex， 当保存在state状态下的数据，如果默认情况下，当改变了state中的数据，再刷新页面时，state中的数据状态会恢复到默认状态，显然在有些时候，这样是不合理的。所以，我们将vuex的状态抽取出来放到localStorage 中，这样就可以实现状态持久化，当数据改变后，再刷新浏览器，该值是不会还原到初始状态的，而vuex刚好提供了一个插件，可以很方便的是状态持久化。那就是vuex-persistedstate插件。

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

使用方法：

1.要求：

• Vue.js (v2.0.0+)
• Vuex (v2.0.0+)

2.安装

$ npm install vuex-persistedstate  --save

3.导入使用

在store.js页面里

import createPersistedState from 'vuex-persistedstate'
const store = new Vuex.Store({
  // 会自动保存创建的状态
  plugins: [createPersistedState()]，
  state:{
   //...
  },
  mutations: {
   //...
  },
  actions: {
   //...
  }
})
export default store

到此结束，就实现了vuex数据持久化。