ReactNative：AsyncStorage 问题：我无法正确检索数据答案

【问题标题】：ReactNative: AsyncStorage Problem : I can't retrieve Data the correctlyReactNative：AsyncStorage 问题：我无法正确检索数据
【发布时间】：2021-07-26 06:39:51
【问题描述】：

我正在尝试通过使用 setItem() 将令牌保存到 AsyncStorage 来在我的项目中使用 AsyncStorage

使用令牌响应的操作

 import axios from 'axios'; 
 import {URL, Config} from '../../service/Api';   
 import AsyncStorage from '@react-native-async-storage/async-storage';

export const checkSmsToLoginUser = value => async dispatch => {
  dispatch({type: 'USER_LOGIN_REQUEST'});
  try {
    const {data} = await axios.post(`${URL}user/checkSMSCode`, value, Config);
    console.log(data.token); // it consoles the token
    await AsyncStorage.setItem('USER_TOKEN', data.token);
    dispatch({type: 'USER_LOGIN_SUCCESS', payload: data?.token});
  } catch (error) {
    dispatch({type: 'USER_LOGIN_ERROR', payload: error});
  }
};

然后我在组件中调度操作，然后尝试使用 getItem 从 AsyncStorage 获取令牌

 const getData = async () => {
    try {
      const token = await AsyncStorage.getItem('USER_TOKEN');
      return token, JSON.parse(token);
    } catch (error) {
      return error;
    }
  };

  console.log(getData(), 'token From AsyncStorage');

但是当我控制台来自 AsyncStorage 的令牌时，我有某种未处理的承诺

任何线索是什么问题或解决方案？

【问题讨论】：

标签： react-native react-native-android react-native-ios asyncstorage

【解决方案1】：

这可能会有所帮助

function App() {

  const getData = async () => {
    try {
      const token = await AsyncStorage.getItem('USER_TOKEN');

      // Log here
      console.log(JSON.parse(token), 'token From AsyncStorage');

    } catch (error) {
      return error;
    }
  };

  useEffect(() => {
   getData(); // call here
  }, []);

  return (
    <View>
      ...
    </View>
  );
}

【讨论】：

【解决方案2】：

您正在打印一个异步函数而不等待它。

代码正确，但控制台日志不正确：

console.log(getData(), '来自 AsyncStorage 的令牌'); // 缺少异步逻辑

在 getData 函数中插入控制台日志，或等待响应。

【讨论】：

【解决方案3】：

通过在UseEffect 中添加getData() 并使用then().catch() 处理承诺对我有用

 useEffect(() => {
    getData()
      .then(res => {
        console.log(res, 'it worked');
        setToken(res);
      })
      .catch(err => {
        setError(err);
        console.log(err);
      });
  }, []);

【讨论】：