vuex实现持久化存储

在使用vuex存储数据的时候刷新页面数据会消失，此时就可以使用持久化存储

使用vuex-persistedstate插件

第一步：下载插件

$ npm install vuex-persistedstate

 第二步：在store的index.js里面引入插件

import createPersistedState from 'vuex-persistedstate'

第三步：在文件中使用

在getters下面使用加上

  plugins: [
    //1.0默认是localStorage
    ceratePersistedState()
    //2.0想要改变存储方式
    createPersistedState({
    //   storage: window.sessionStorage或者window.localStorage或者window.cookie,
      // 存储的 key 的key值
      key: "store",
      reducer(state) { 
        //1.0 如果想要存储state中的某些值
        return { 
            near:state.near,
            mid:state.mid,
            far:state.far
        };
        //2.0 如果想要存储state中的所有值
        return{
            ...state
      }
    })
  ]