You need to enable JavaScript to run this app. React Native使用AsyncStorage存对象后JSON.parse解析异常,键仍带引号
优惠活动
大模型
产品
解决方案
定价
更多

React Native使用AsyncStorage存对象后JSON.parse解析异常,键仍带引号

问题原因拆解

两个核心认知偏差导致了你以为解析失败

  • 打印逻辑错位,拿原始字符串当解析结果
    你当前代码里的console.log(jsonValue),打印的是从AsyncStorage读取的、还没经过JSON.parse处理的原始字符串——也就是当初调用JSON.stringify存进去的内容。从代码流程上,你根本没有把JSON.parse(jsonValue)的返回值打印到控制台过,把打印出来的原始字符串当成了解析后的结果,自然会觉得“键还带着双引号、没有得到正常对象”。
  • 对调试控制台的显示规则存在误解
    就算你正确拿到了JSON.parse返回的普通JS对象,React Native配套的调试工具(Flipper、Chrome DevTools)在格式化打印对象时,会默认给所有对象的键加上双引号展示,这是通用的控制台显示逻辑,不代表实际运行时的数据结构有问题。JS语法允许写对象字面量时省略键的双引号,只是语法糖,不代表运行时的键本身的属性和引号有关,更不代表解析失败。

怎么验证你的代码其实是正常的

你只需要调整读取逻辑,把解析后的结果单独做校验,就能确认问题:

const getData= async () => {
    const jsonValue = await AsyncStorage.getItem('@storage_Key')
    console.log('AsyncStorage读出的原始字符串:', jsonValue) // 就是你之前看到的带双引号的内容
    // 单独保存解析后的结果
    const parsedData = JSON.parse(jsonValue)
    console.log('JSON.parse后的实际对象:', parsedData)
    // 直接用常规点语法访问属性,能拿到值就说明完全正常
    console.log('直接访问title字段:', parsedData.title) // 会正常输出 Hummus
    return parsedData
}

补充说明:你当前的存储、读取逻辑本身完全符合AsyncStorage的官方使用规范——AsyncStorage仅支持字符串格式存储,搭配JSON.stringify序列化对象、JSON.parse反序列化取值的写法没有任何逻辑问题。如果真的出现解析异常导致键带双引号的特殊情况,你必须用parsedData['"title"']这种把双引号包含在键名里的写法才能访问到对应值,这时候才需要排查解析逻辑的问题。


内容的提问来源于stack exchange,提问作者filip76

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.11.10 16:15:00