"在 sessionStorage 和 localStorage 之間切換的 vuex-persistedstate"

Question

如果使用者選擇了「記得我」複選框，我想要從sessionStorage切換到localStorage，同時我使用vuex-persistedstate

export default store(function (/* { ssrContext } */) {
  const Store = createStore({
    state: {
    },
    actions: {
      setLodingMode({ commit }, newMode) {
        commit("SET_LOADING_MODE", newMode);
      },
      resetStates({ commit }) {
        commit("AUTHENTICATION_RESET_STATE");
        commit("login/RESET_STATE");
      },
    },
    modules: { login, authentication },
    plugins: [createPersistedState()],
  });

  return Store;
});

關鍵在於我想要像這樣進行更改

state: {
      flag: false
        },
plugins: [
      createPersistedState({
        storage: flag ? window.localStorage : window.sessionStorage,
      }),
    ],

我希望flag根據使用者在登入時選擇的「記住我」複選框而改變，所以當使用者選擇複選框時，flag變為true，並且所有資料保存在localStorage中

;

Answer 1

根據@Estus Flask的評論，我使用了自定義存儲，並通過直接調用localStorage來管理“記住我”選項，並在localStorage中設置了一個標誌。

plugins: [
      createPersistedState({
        paths: ["authentication.userAuthenticationInfo"],
        storage: {
          getItem(key) {
            if (localStorage.getItem("rememberMe") == 1) {
              return localStorage.getItem(key);
            } else {
              return Cookies.get(key);
              //return sessionStorage.getItem(key);
            }
          },
          setItem(key, value) {
            if (localStorage.getItem("rememberMe") == 1) {
              localStorage.setItem(key, value);
            } else {
              Cookies.set(key, value);
              //sessionStorage.setItem(key, value);
            }
          },
          removeItem(key) {
            if (localStorage.getItem("rememberMe") == 1) {
              localStorage.removeItem(key);
            } else {
              Cookies.remove(key);
              //sessionStorage.removeItem(key);
            }
          },
        },
      }),
    ],

並且我在每次登出或401回應時清除localStorage。