React Native中AsyncStorage.multiGet获取数据无法转JSON格式问题

问题原因 #

AsyncStorage的multiGet接口返回的是二维数组结构，每个子元素的格式为[存储key, 序列化的JSON字符串]，你之前直接对整个返回结果调用JSON.parse，相当于解析数组整体而不是每一项里的JSON字符串，自然会抛出语法错误。

解决方法 #

1. 修改getOrgsSaved方法，批量解析返回结果 #

拿到multiGet的返回数组后，遍历每一项，取出第二个元素做JSON.parse即可，代码如下：

const getOrgsSaved = async () => {
    try {
        const keys = await AsyncStorage.getAllKeys();
        const orgPairs = await AsyncStorage.multiGet(keys)
        // 遍历二维数组，解析每一项的JSON字符串
        const parsedOrgs = orgPairs.map(pair => JSON.parse(pair[1]))
        return parsedOrgs
    } catch (e) {
        console.log(e)
        return [];
    }
}

2. 可选：增加容错逻辑避免个别存储项损坏导致全量解析失败 #

如果担心部分存储的内容不是合法JSON，可以加个try catch包裹单条解析逻辑：

const parsedOrgs = orgPairs.map(pair => {
  try {
    return JSON.parse(pair[1])
  } catch(err) {
    console.log(`解析key为${pair[0]}的存储项失败:`, err)
    return null
  }
}).filter(Boolean) // 过滤掉解析失败的无效项

修改后返回的parsedOrgs就是可直接遍历的对象数组，不需要对业务层其他代码做额外调整。

内容的提问来源于stack exchange，提问作者Matheus Martins