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
相关产品推荐
相关产品推荐

