最初使用vuex-persistedstate,项目中的vue结构是这样的
...
import persistedState from 'vuex-persistedstate'
const store = new Vuex.Store({
state: {
...
},
getters: {
...
},
mutations: {
...
},
actions: {
...
},
plugins: [persistedState({
storage: window.localStorage
})],
});
还可以去指定缓存某个字段,这样
plugins: [persistedState({
storage: window.localStorage,
reducer (val) {
return {
// 只储存state中的menuId字段
menuId: val.menuId
}
})]
现在项目中的vuex使用了modules的形式,尝试了这样,在单个modules中使用插件
import State from '../states/home/state'
import Mutation from '../mutations/home/mutation'
import Action from '../actions/home/action'
import Getter from '../getters/home/getter'
import persistedState from 'vuex-persistedstate'
const homeModule = {
state: State,
mutations: Mutation,
actions: Action,
getter