关键词：
【中文标题】localstorage.getItem() 在 NUXT JS 中不起作用【英文标题】：localstorage.getItem() not working in NUXT JS 【发布时间】：2021-07-03 02:54:09 【问题描述】：我正在尝试使用 nuxt js 开发一个购物车。我已成功将购物车数据存储在本地存储中，但无法检索数据。
注意：我不想使用 vuex-persistedstate。
【问题讨论】：
究竟是什么问题？出现错误、未返回数据、响应与预期不同？ 查看我检查的第一个文件是否可以从本地存储中获得数据，然后显示该数据。如果没有，则显示一个空数组。但它总是返回空数组。 阅读我的回答。这里有很多问题。为了使 Vuex 具有响应性，您需要在提交中更新值。其次，提交应该始终没有副作用，并且只更新单个存储项。您可以链接提交，或使用操作从提交中运行其他方法 【参考方案1】：我发现这有很多小问题。
首先，从您提交saveInLocalStorage 的事实来看，您似乎已经输入了addToCart 和saveInLocalStorage。
突变只能用于设置单个 Vuex 变量的状态。
它们应该是纯净的，这意味着它们不应该有副作用。
在使用dispatch 运行saveInLocalStorage 操作之前，您需要使用saveInLocalStorage 的操作和commit 的操作addToCart 突变。
其次，不清楚您实际上是在哪里运行此 get from local storage 功能。你是在 Vuex 商店的顶层运行它吗？
如果是这样，为了解决它不更新 Vuex 存储的实际问题，您将希望有一个函数负责获取 storedCart 的值并使用它将 cart 设置为突变以确保 Vuex存储实际更新。
最后，这里没有必要使用三元组。只需将 Vuex cart 对象设置为空数组即可。
【讨论】：
你能告诉我如何制作一个更新购物车并将其设置为 storeCart 的函数 这只是一个突变。你的意思是从本地存储加载它并设置它？同样，这也必须是一个突变。任何更新 Vuex 变量的东西都需要是一个突变。任何有副作用的事情都需要采取行动。动作可以使用突变。阅读此 :) vuex.vuejs.org/guide/actions.html 了解操作 您应该创建一个保存到本地存储的操作，然后提交一个更改以推送到购物车。然后你应该创建一个从本地存储获取的突变并设置存储数据 假设我有一个突变 getCartFromLocal() 我从本地存储中获取我的数据。我应该在哪里提交突变？ 你可以从任何你想要的地方调用它，真的。我个人会在你的布局/页面组件的created() 生命周期钩子中调用它——第一个，最顶层的组件。如果它依赖于首先安装的组件，请改用mounted()localstorage.getItem() 在 NUXT JS 中不起作用
】localstorage.getItem()在NUXTJS中不起作用【英文标题】：localstorage.getItem()notworkinginNUXTJS【发布时间】：2021-07-0302:54:09【问题描述】：我正在尝试使用nuxtjs开发一个购物车。我已成功将购物车数据存储在本地存储中，但无法检索数据... 查看详情
localStorage - 使用 getItem/setItem 函数或直接访问对象？
】localStorage-使用getItem/setItem函数或直接访问对象？【英文标题】：localStorage-usegetItem/setItemfunctionsoraccessobjectdirectly?【发布时间】：2012-10-1701:27:34【问题描述】：使用定义在localStorage对象上的方法与直接访问对象属性相比有什么... 查看详情
`localStorage 中的 prop` 与 `localStorage.getItem('prop')!==null`
】`localStorage中的prop`与`localStorage.getItem(\\\'prop\\\')!==null`【英文标题】：`propinlocalStorage`vs`localStorage.getItem(\'prop\')!==null``localStorage中的prop`与`localStorage.getItem(\'prop\')!==null`【发布时间】：2015-08-2114:48:51【问 查看详情
localStorage.getItem('item') 是不是优于 localStorage.item 或 localStorage['item']？
】localStorage.getItem(\\\'item\\\')是不是优于localStorage.item或localStorage[\\\'item\\\']？【英文标题】：IslocalStorage.getItem(\'item\')betterthanlocalStorage.itemorlocalStorage[\'item\']?localStorage.getItem(\'item\')是否优于localStora 查看详情
有没有办法将 localstorage:getItem() 的结果从 webview 传递给活动
】有没有办法将localstorage:getItem()的结果从webview传递给活动【英文标题】：Isthereawaytopassresultoflocalstorage:getItem()toactivityfromwebview【发布时间】：2019-04-0405:54:19【问题描述】：我正在使用webview在android中加载页面。一旦页面加载完毕... 查看详情
即使值存在，localStorage.getItem() 也始终返回 null
】即使值存在，localStorage.getItem()也始终返回null【英文标题】：localStorage.getItem()alwaysreturnsnullevenwhenvalueexists【发布时间】：2019-05-2813:10:36【问题描述】：我不确定如果我做错了什么或者我在某处有错字，但我正在尝试比较vue项目... 查看详情
将 localStorage.getItem() 与打字稿一起使用
】将localStorage.getItem()与打字稿一起使用【英文标题】：UselocalStorage.getItem()withtypescript【发布时间】：2021-08-1410:18:35【问题描述】：我有以下代码行：constallGarments=teeMeasuresAverages||JSON.parse(localStorage.getItem("teeMeasuresAverages"))||teeMeas 查看详情
Angular 8 graphql.module localstorage.getItem 不可用
】Angular8graphql.modulelocalstorage.getItem不可用【英文标题】：Angular8graphql.modulelocalstorage.getItemnotavailable【发布时间】：2020-09-0911:32:36【问题描述】：使用的版本：Angular版本：8.3阿波罗客户端：2.6.0我正在尝试将graphql与授权的jwt令牌... 查看详情
Mozilla localStorage.getItem 基于唯一密钥的部分知识
】MozillalocalStorage.getItem基于唯一密钥的部分知识【英文标题】：MozillalocalStorage.getItembasedonpartialknowlegeofanuniquekey【发布时间】：2021-10-1211:05:59【问题描述】：我正在寻找基于唯一密钥的部分知识从MozillalocalStorage获取项目的快速方... 查看详情
window.localstorage运用
window.localStorage.getItem(‘键‘)；//getItem获取浏览器localStorage保存的键的值；window.localStorage.setItem(‘键‘，‘值‘)；//setItem保存键的值到浏览器的localStorage; 查看详情
localstorage的用法
window.localStorage.getItem(key:string) window.localStorage.setItem(key:string,value:string)JSON.parse(window.localStorage.getItem(key:string))window.localStorage.setItem(key:string,JSON.stringif 查看详情
localstorage(代码片段)
...ocalstorge内容。3、最后在提交的时候，清空localstorge//存储localStorage。因为addForm是对象类型。localStorage.setItem("tempData",JSON.stringify(this.addForm));//获取localStorage的数据JSON.parse(localStorage.getItem("tempData"));//将获取的数据赋值给addFormObject.... 查看详情
将localstorage值增加一(代码片段)
...们踢出去了。为了计算他们尝试了多少次，我想我会使用localStorage，因为我可以很容易地操作它。但是，当他们无法验证自己时，我无法增加值。在顶部，我正在设置localStorage变量localStorage.setItem("attempts","0")然后如果服务器返回... 查看详情
localstorage累加存取数组
/**累加存值*/ varyongyaofanan={ getItem:function(){ returnJSON.parse(window.localStorage.getItem(‘yongyaofanan‘))||{};//取值 }, setItem:function(item){ window.localStorage.setItem(‘yongyaofanan‘,JSON.st 查看详情
windowlocalstorage属性
定义和使用localStorage和sessionStorage属性允许在浏览器中存储key/value对的数据。localStorage用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。localStorage属性是只读的。提示: 如果你只想将数据保存在当前... 查看详情
vuex配置token和用户信息
首先设计的是登录成功后端产生token，前端取出放在LocalStorage，便于后面每个请求默认带上这里的token以及取用户相关信息 和main.js同级建store.js文件，代码如下importVuefrom‘vue‘importVuexfrom‘vuex‘//importgetproductByIndexfrom‘@/data/g... 查看详情
localstorage
...3c****************************/二、用法小结（一）设置值1. localStorage.setItem(key,value):如果key的value存在时，更新key的值,例：localStorage.setItem("name","moomoo");//【推荐写法】2. localStorage.name="moomoo";3. localStorag... 查看详情
h5本地存储：sessionstorage和localstorage(代码片段)
...18:30H5提供了二种非常好用的本地存储方法：sessionStorage和localStorage，下面分别介绍一下：1.sessionStorage：保存的是一个会话的数据，也就是说只在一次会话中有效，关闭就会销毁数据，不是持久的本地数据存储，只是一个会话的... 查看详情