vuex的持久化

首先说一下vuex持久化的工作原理吧，
为了再刷新的时候，保持我们的登录状态，以及一些重要的文件，我们需要存储一些东西在缓存里面；
而当我们开发的时候，不知道什么时候缓存什么值，就会导致各种小bug，一刷新，找不到了；
vuex-persistedstate的理念就是把store里面的数据自动缓存起来；
下面看一下代码

import vue from "vue";
import vuex from "vuex";
import mutations from "./mutation";
//import getters from "./getter";
import createPersistedState from "vuex-persistedstate";

vue.use(vuex);

const state = {
    user: false
};

const vuexPersisted = new createPersistedState({
    key: "state",
    storage: window.localStorage,
    modules: state
});
export default new vuex.Store({
    state,
    mutations,
    //getters,
    plugins: [vuexPersisted]
});

引入vuex-persistedstate，并创建
key是缓存时的字段名称
storage时缓存方式，可以是localStorage，也可以是sessionStorage，或者自己定义一些存取方式
modules，是你要缓存的东西
然后在export里面当作插件引入
这个时候差不多就完成一半了，当然，你想让他起作用，得刺激一下他们啊
mutations.js

export default {
    login(state) {
        state.user = !state.user;
    }
}

app.vue

 changeuser(data){
        console.log(data);
        this.user = data;
        this.$store.commit('login')
      }

登陆的时候去执行app.vue里卖弄的changeuser（），自己命名也行，登陆完成后执行this.$store.commit('login')即可
现在，你可以去试试了