ReactNative: AsyncStorage Problem : I can't retrieve Data the correctly

Question

I am trying to use the AsyncStorage in my Project by Saving the token to the AsyncStorage by using setItem()

Action that response with token

 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});
  }
};

and I dispatch the action in the component, then I try to get the the token from the the AsyncStorage by using getItem

 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');

but when I console the token that comes from the AsyncStorage, I have some sort of unhandled promise

any clue what's the problem or maybe solution?

Answer 1

This might help

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>
  );
}