React Native中AsyncStorage.getItem返回undefined问题求助

看起来你遇到的问题主要来自两个地方：混合使用async/await和.then()导致变量赋值错误，以及对存储数据结构的读取逻辑不匹配。我们一步步来解决：

核心错误原因 #

1. async/await与.then()混合使用的坑
   你在addItem里写了：

   const res = await AsyncStorage.getItem('itemArray')
     .then(req => JSON.parse(req))
     .then(json => console.log(json));
   

   这里的问题是：.then(json => console.log(json))这个回调函数的返回值是undefined（因为console.log没有返回值），所以await拿到的结果res就变成了undefined，这就是你后续报错Cannot read property 'data' of undefined的根源。

2. 存储与读取的数据结构不匹配
   你的storeData函数是把itemArray包裹在一个{ data: itemArray }的对象里存储的，所以读取后需要先拿到这个对象的data属性，而不是直接访问res.data（因为res已经是undefined了）。

修正后的代码 #

修正addItem函数 #

我们统一使用async/await写法，去掉.then()链，让逻辑更清晰：

addItem = async () => {
  try {
    // 先获取存储的原始数据
    const storedString = await AsyncStorage.getItem('itemArray');
    let itemArray;

    if (storedString !== null) {
      // 解析成对象，然后取出data属性
      const storedData = JSON.parse(storedString);
      itemArray = storedData.data;
      // 追加新item
      itemArray.push({
        keywords: this.state.keywords,
        color: this.state.color,
        size: this.state.size
      });
    } else {
      // 初始化数组并添加第一个item
      itemArray = [{
        keywords: this.state.keywords,
        color: this.state.color,
        size: this.state.size
      }];
    }

    // 保存更新后的数组
    await this.storeData(itemArray);
    console.log('Item added successfully!');
  } catch (e) {
    console.log('Error adding item:', e);
  }
}

关于storeData函数 #

你的storeData函数本身逻辑是没问题的，但如果后续不需要额外的data属性包裹，也可以简化成直接存储数组（这样读取时就不用再取data属性了），简化版如下：

// 简化版storeData（可选）
storeData = async (itemArray) => {
  try {
    await AsyncStorage.setItem('itemArray', JSON.stringify(itemArray));
    console.log('success!');
  } catch (e) {
    console.log('Error saving data:', e);
  }
}

如果用这个简化版，addItem里的读取逻辑也要对应修改：直接把itemArray = storedData.data;改成itemArray = JSON.parse(storedString);即可。

额外建议 #

• 尽量避免同时使用async/await和.then()，选择一种风格保持代码一致性，async/await在处理异步逻辑时通常更易读。
• 可以给AsyncStorage的键名定义一个常量（比如const ITEM_ARRAY_KEY = 'itemArray'），避免拼写错误。
• 在读取AsyncStorage时，最好处理JSON解析可能出现的错误（比如存储的数据格式损坏），可以在JSON.parse外面再加一层try/catch。

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