vuex刷新页面后如何解决丢失store的数据问题

export default {
  name: 'app',
  created () {
    // 在页面加载时读取sessionStorage
    if (sessionStorage.getItem('store')) {
      this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem('store'))))
    }
    // 在页面刷新时将store保存到sessionStorage里
    window.addEventListener('beforeunload', () => {
      sessionStorage.setItem('store', JSON.stringify(this.$store.state))
    })
  }
}

npm install vuex-persistedstate -S

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from "vuex-persistedstate"
Vue.use(Vuex)
const store = new Vuex.Store({
    plugins: [createPersistedState()],
})

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from "vuex-persistedstate"
Vue.use(Vuex)
const store = new Vuex.Store({
    plugins: [createPersistedState({
        storage: window.sessionStorage
    })],
})

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from "vuex-persistedstate"
Vue.use(Vuex)
const store = new Vuex.Store({
    plugins: [createPersistedState({
        storage: window.sessionStorage,
        // 方法1：用reducer，这里的val是由store里面的所有state，不加reducer为储存所有，reducer为指定存储
        reducer(val)  {
            return {
                // 只储存state中的name
                keyName: val.name
            }
        }
        // 方法2：用paths,数组里面填模块名，存储指定模块
        // paths: ['Home', 'Order']
    })]
})