javascript - 如何访问 NuxtJs 存储中的 localStorage?

标签 javascript vue.js vuex nuxt.js

我正在尝试从 localStorage 获取一个值以确定存储中变量的值。我记得大约一年前用 vuejs 尝试过类似的东西,它似乎有效。我在 Reactjs 上也没有这个问题。但出于某种原因,我在 Nuxt 中做同样的事情时总是收到这个错误

enter image description here

enter image description here

这是我的 user.js 文件

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

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

我处理这个问题有错吗?或者这不应该工作?感谢您的帮助。

最佳答案

当您使用 SSR 时,您无权访问浏览器存储空间。

要解决此问题,您可以在挂载的组件 Hook 上分派(dispatch)一个操作。

mounted() {

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

关于javascript - 如何访问 NuxtJs 存储中的 localStorage?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62789608/

相关文章:

javascript - 传递给子组件的 Vue.js Prop 对象未定义

vue.js - Nuxt/Vuex/Vue react 性问题增量

javascript - Google Script HtmlService,获取通过多个选项卡复制的 URL 变量

javascript - 在第一个正则表达式传入 JavaScript 后,如何继续检查验证?

javascript - Vue.js axios delete方法删除数组中的错误对象

javascript - Vue js v-autocomplete 不能正确更新动态更改的项目

vue.js - Vue中获取子组件的输入值

javascript - Vuex map 状态未定义状态

javascript - Firebase云函数错误: Function returned undefined,预期的Promise或值

javascript - ViewMatrix 计算弄乱了模型