为何我的AsyncStorage返回的是之前存储的值？

你的问题核心是React状态更新的异步特性，而非AsyncStorage的存储问题，具体原因和修复方案如下：

问题根源 #

setUser是异步操作，调用后不会立刻更新user状态。你在setUser之后直接打印user.name，拿到的还是当前函数作用域内的旧state值，并非AsyncStorage返回了旧数据。另外初始状态user为undefined，直接访问user.name还会触发报错。

修正后的代码 #

import { useState, useEffect } from 'react';
import { Button } from 'react-native';
import AsyncStorage from '@react-native-async-storage/async-storage';

function App() {
  const [user, setUser] = useState();

  const storeData = async () => {
    const value = {
      "name": "jameel",
      "email": "caseyvlogger2311",
      "age": "23",
    }
    try {
      const jsonValue = JSON.stringify(value)
      await AsyncStorage.setItem('@profile', jsonValue)
      console.log("saved")
      console.log('console after saving (original value): ' + value.name)
    } catch (e) {
      console.error("保存失败：", e)
    }
  }

  const getData = async () => {
    // 处理user未初始化的情况，避免报错
    console.log('console in getData (user useState name): ' + (user?.name ?? '未初始化'))
    try {
      const jsonValue = await AsyncStorage.getItem('@profile')
      if (jsonValue != null) {
        const parsedUser = JSON.parse(jsonValue)
        setUser(parsedUser)
        // 直接打印刚解析的值，而非state（state还未更新）
        console.log("console parsed value after getting data: " + parsedUser.name)
      } else {
        console.log("未找到存储数据")
      }
    } catch(e) {
      console.error("读取失败：", e)
    }
  }

  // 监听user状态变化，打印真正更新后的state值
  useEffect(() => {
    if (user) {
      console.log("user状态已更新：", user.name)
    }
  }, [user])

  return (
    <>
      <Button onPress={storeData}>Save data</Button>
      <Button onPress={getData}>Get data</Button>
    </>
  )
}

关键修正点 #

1. 避免直接依赖异步更新的state：调用setUser后，直接打印刚解析的parsedUser，而非user（此时user仍是旧值）。
2. 监听state变化：用useEffect监听user的变化，当state真正完成更新后，这里会触发并输出最新值。
3. 处理undefined边界：用可选链user?.name和空值合并运算符??避免未初始化时的报错。
4. 添加错误日志：在catch块中打印错误信息，方便排查存储/读取失败的场景。

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