Vuex 解決了多檢視之間的資料共享問題。但是資料並不能持久化，只要一重新整理頁面，你儲存在 Vuex 中的 store 裡的資料就丟失了。

引入vuex-persist 外掛，它就是為 Vuex 持久化儲存而生的一個外掛。不需要你手動存取 storage ，而是直接將狀態儲存至 cookie 或者 localStorage 中。

安裝：

npm install --save vuex-persist

or
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]
}) 

通過以上設定，在圖3中各個頁面之間跳轉，如果重新整理某個檢視，資料並不會丟失，依然存在，並且不需要在每個 mutations 中手動存取 storage 。

vuex-persist 的詳細屬性：

作者：孟煩了的愛豆
連結：https://www.jianshu.com/p/a4faae6a3184