"在 sessionStorage 和 localStorage 之間切換的 vuex-persistedstate"
P粉295728625
2023-08-25 23:06:52
<p>如果使用者選擇了「記得我」複選框，我想要從sessionStorage切換到localStorage，同時我使用vuex-persistedstate</p>
<pre class="brush:php;toolbar:false;">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;
});</pre>
<p>關鍵在於我想要像這樣進行更改</p>
<pre class="brush:php;toolbar:false;">state: {
flag: false
},
plugins: [
createPersistedState({
storage: flag ? window.localStorage : window.sessionStorage,
}),
],</pre>
<p>我希望flag根據使用者在登入時選擇的「記住我」複選框而改變，所以當使用者選擇複選框時，flag變為true，並且所有資料保存在localStorage中</p> ;
根據@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。