Vuex持久化存储

Vuex 解决了多视图之间的数据共享问题，但是运用过程中又带来了一个新的问题Vuex 的状态存储并不能持久化，也就是说当我们存储在 Vuex 中的 store 里的数据，只要一刷新页面，数据就丢失了

解决：

引入vuex-persist 插件，它就是为 Vuex 持久化存储而生的一个插件，不需要手动存取 storage ，而是直接将状态保存至 cookie 或者 localStorage 中

安装：

npm install --save vuex-persist

或者

yarn add vuex-persist



引入：
import VuexPersistence from 'vuex-persist'



创建一个对象并进行配置：
const vuexLocal = new VuexPersistence({
    storage: window.localStorage
})



引入进vuex插件：
const store = new Vuex.Store({
  state: { ... },
  mutations: { ... },
  actions: { ... },
  plugins: [vuexLocal.plugin]
}) 

设置好以后在中各个页面之间跳转，如果刷新某个视图，数据并不会丢失，依然存在，并且不需要在每个 mutations 中手动存取 storage 

当然解决的方法千变万化 这只是其中一种其余纯看个人理解