NuxtJs 스토어에서 localStorage에 액세스하려면 어떻게 해야 합니까?

NuxtJs 스토어에서 localStorage에 액세스하려면 어떻게 해야 합니까?

저장 중인 변수의 값을 결정하기 위해 localStorage에서 값을 가져오려고 합니다.약 1년 전에 Vuejs와 비슷한 것을 시도했는데 효과가 있었던 것으로 기억합니다.나도 Reactjs에 대해 아무런 문제가 없다.하지만 어떤 이유에서인지 Nuxt에서 같은 작업을 할 때 이 오류가 계속 발생합니다.

이건 내 파일이야

export const state = () => ({
  isLoggedIn: !!localStorage.getItem('userDetails')
})

export const mutations = {
  login(state) {
    state.isLoggedIn = true;
  },
  logout(state) {
    window.localStorage.clear()
    state.isLoggedIn = false;
  }
}

제가 이 문제에 잘못 접근하고 있나요?아니면 이게 안 되는 건가요?어떤 도움이라도 감사합니다.

SSR를 사용하면 브라우저 저장소에 액세스할 수 없습니다.

이 문제를 해결하려면 마운트된 구성 요소 후크에 작업을 디스패치하면 됩니다.

mounted() {

 if(!process.client) return;
 const savedData = localStorage.getItem("userDetails");
 if(savedData){
    this.$store.commit('myMutation',savedData)
}
}

다음과 같이 시도해 보십시오.

isLoggedIn: process.server ? '' : !!localStorage.getItem('userDetails')

문제는 nuxt가 서버 측에 있는 동안 로컬 스토리지에 액세스하려고 한다는 것입니다.에 확인할 필요가 있습니다.process.server서버측인지 아닌지를 확인합니다.true 또는 false 중 하나를 반환합니다.

나는 그것을 테스트하지 않았지만 이 3진 연산자로는 작동할 것이다.

여기: https://nuxtjs.org/faq/window-document-undefined/

로컬 스토리지를 설정하지 않은 것을 알 수 있습니다.로컬 저장소를 설정해주세요

로컬 스토리지setItem()

Google에서 여기로 오는 사람들을 위해 SSR를 사용하지 않고 이를 수행할 수 있는 플러그인을 작성했습니다.

https://www.npmjs.com/package/nuxt-vuex-localstorage-sync

언급URL : https://stackoverflow.com/questions/62789608/how-do-i-access-localstorage-in-store-of-nuxtjs