vuex-persistedstate(存储vuex中的数据)

在vuex中,刷新页面后数据会丢失的现象

1.安装 cnpm install vuex vuex-persistedstate 

 vuex-persistedstate 实际上使用了 HTML 5中的 localStorage (默认,不修改的情况下)来做缓存,这样在刷新页面后之前 state 的数据不会丢失。

可以支持localStorage 和 sessionStorage   

2.在 state 【index.js】中:

 1 import Vue from 'vue'
 2 import Vuex from 'vuex'
 3 import * as actions from './actions'
 4 import * as getters from './getters'
 5 import createPersistedState from 'vuex-persistedstate'
 6 import state from './state'
 7 import mutations from './mutations'
 8 
 9 Vue.use(Vuex)
10 
11 export default new Vuex.Store({
12     actions,
13     getters,
14     state,
15     mutations,
16     plugins: [createPersistedState({
17         storage: window.sessionStorage   // 默认是 plugins: [createPersistedState()],对应的是window.localstorage
18     })
19    ]
20 })
原文地址:https://www.cnblogs.com/tian-long/p/8434331.html