Vuex 在刷新后持久丢失数据答案

【问题标题】：Vuex persist losses data after refreshVuex 在刷新后持久丢失数据
【发布时间】：2021-07-31 22:57:52
【问题描述】：

我想保存一些在页面重新加载后需要持久保存的数据。我偶然发现了 Vuex。我设法让它在一个纯 Javascript 的项目中工作，但由于某种原因，我没有让它在 TypeScript 中工作。刷新后，数据使用默认值，而不是页面刷新前分配的数据。

import Vue from 'vue'
import Vuex from 'vuex'
import VuexPersistence from 'vuex-persist'
import LanguageEntry from '../classes/LanguageEntry'

Vue.use(Vuex)

export interface State {
  IsDark: boolean;
  CurrentLanuage: string;
  LanguageValues: Array<LanguageEntry>;
}

export default new Vuex.Store<State>({
  state: {
    IsDark: false,
    CurrentLanuage: "DE",
    LanguageValues: Array<LanguageEntry>(),
  },
  plugins: [new VuexPersistence().plugin],
})

【问题讨论】：

标签： typescript vuejs2 vuex

【解决方案1】：

我使用一个流行的插件在刷新后保存数据vuex-persistedstate，我今天注意到它最近比你的更新。

我在 /route index.js 中使用它，例如：

import createPersistedState from 'vuex-persistedstate';

export default function (/* { ssrContext } */) {
  const store = new Vuex.Store({
    modules: {
      // example
    clients,
    auth: authentication,
    },
  plugins: [createPersistedState()],
    // enable strict mode (adds overhead!)
    // for dev mode only
    strict: process.env.DEBUGGING
  })

  return store
}

【讨论】：