vuex持久化存储下载插件

问题

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

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

安装命令

cnpm install vuex-persist --save

引入
内联代码片段

//导入持久化依赖包
import VuexPersistence from 'vuex-persist'
//实例化持久化插件对象
const vuexLocal = new VuexPersistence({
    storage: window.localStorage,//存储介质,
    key: "vuex",//存储到本地存储
})

new Vuex.Store({
   ....,
    plugins: [vuexLocal.plugin]
})

属性	类型	描述
key	string	将状态存储在存储中的键。默认: ‘vuex’
storage	Storage (Web API)	可传localStorage, sessionStorage, localforage 或者你自定义的存储对象. 接口必须要有get和set. 默认是: window.localStorage