vuex数据持久化存储

　　想一想好仍是说下vuex数据的持久化存储吧。依稀还记得在作第一个vue项目时，因为刚刚使用vue,对vue的一些基本概念只是有一个简单的了解。当涉及到非父子组件之间通讯时，选择了vuex。只是后来居然发现，刷新页面，数据去哪了？？？一脸懵逼。其实vuex本质上只是一个公共变量，是存储在浏览器内存中的，刷新页面，浏览器内存重置，数据也会被清空。若是要作数据持久化存储，确定须要借助浏览器缓存，经常使用的也就localStorage,sessionStorage,indexDB以前了解一点，用的不是不少。如今也有不少数据持久化存储插件，原理都差很少，下面介绍一下vuex-persist的基本使用：

　　一、安装　

npm install vuex-persist -D

　　二、基本使用

import Vue from 'vue'
import Vuex from 'vuex'
import state from './state'
import getters from './getters'
import mutations from './mutations'
import actions from './actions'
import VuexPersist from 'vuex-persist'

Vue.use(Vuex);

const vuexLocal = new VuexPersist({
  storage: window.localStorage //可选，sessionStorage/indexDB
});

const store = new Vuex.Store({
  state,
  getters,
  mutations,
  actions,
  plugins: [vuexLocal.plugin]
});

export default store