vuex的持久化存储

vuex的持久化存储是通过第三方插件vuex-persistedstate来实现的。该插件可以将vuex的状态保存到localStorage或sessionStorage中，以实现刷新页面后状态的保留。使用vuex-persistedstate的步骤如下：

1. 安装vuex-persistedstate插件：在项目中运行以下命令进行安装：

$ npm install vuex-persistedstate

2. 引入vuex-persistedstate插件并配置：

import Vue from "vue";
import Vuex from "vuex";
import createPersistedState from "vuex-persistedstate";

Vue.use(Vuex);

export default new Vuex.Store({
  // ...其他配置项

  plugins: [
    createPersistedState({
      storage: window.sessionStorage,  // 存储方式：localStorage、sessionStorage、cookies
      key: "store",  // 存储的key值
      reducer(state) {  // 要存储的数据
        return { ...state };  // 存储整个state中的数据
      }
    })
  ]
});

通过上述配置，每当修改状态时，插件会将状态存储到指定的存储方式（如sessionStorage）中，当浏览器刷新时，插件会从存储中读取状态并还原到vuex中，从而实现了vuex的持久化存储。