vue-typescript-admin-template项目开发保持Vuex持久化的方法
vuex-persist
vuex-module-decorators
步骤：
1、安装 vuex-persist
指令：
npm install --save vuex-persist
or
yarn add vuex-persist
2、在 store/index.ts中添加
ts 用法：
import VuexPersistence from 'vuex-persist'
const vuexLocal = new VuexPersistence<RootState>({
storage: window.localStorage
})
// 添加插件
const store = new Vuex.Store<State>({
state: { ... },
mutations: { ... },
actions: { ... },
plugins: [vuexLocal.plugin] //主要是这一行
})
3、修改store/test.model文件
我这里store下有一个user.model,你们就修改自己的文件
默认文件中为
@Module({ dynamic: true, store: store, name: 'user' })
要修改为
@Module({ dynamic: true, store: store, name: 'user', preserveState: true })
以下是官网vuex-module-decorators给出了2个方法：
当它没有初始状态并且您从 localStorage 加载状态时：
@Module({ dynamic: true, store: store, name: 'mm', preserveState: localStorage.getItem('vuex') !== null })
如果您想保留状态，例如从 vuex-persist 加载状态时：
@Module({ dynamic: true, store: store, name: 'mm', preserveState: true })
|