AsyncStorage.getItem возвращает неопределенное значение (даже с .then и .parse)

Question

Я пытаюсь сохранить данные в AsyncStorage и загрузить их обратно (очевидно). Функция .setItem работает, и уведомление появляется в нижней части симулятора iOS, когда я его вызываю. Однако функция .getItem не работает, и когда я ее улавливаю, возвращает undefined. У меня есть две функции для хранения и извлечения данных:

    setData = (rawDataToStore, keyToStore) => {
        data_store = JSON.stringify(rawDataToStore);
        AsyncStorage.setItem(keyToStore, data_store, () => {
            console.warn('Stored data!')
        } )
    }

    getData = (keyToSearch) => {
        AsyncStorage.getItem(keyToSearch).then(storage => {
            parsed_data = JSON.parse(storage);
            return parsed_data
        }).catch(e => console.warn(e))
    }

Я только что протестировал функции в моем рендере ():

, чтобы сохранить данные:

this.setData({value: 1}, "test_data");

для загрузки данных:

console.log(this.getData("test_data"));

console.log просто возвращает undefined.

Я совершенно новичок в Asyncstorage, но что я делаю не так?

Answer 1

Ваш console.log возвращает undefined ... потому что ваша функция setData еще не завершила свою работу ... сначала вам нужно await, потому что это асинхронная операция.

class YourComponent extends React.Component {
  async componentDidMount() {
    await this.setData();
    const data = await this.getData();

    console.log('data returned', data);
  }

  setData = async (rawDataToStore, keyToStore) => {
    data_store = JSON.stringify(rawDataToStore);
    await AsyncStorage.setItem(keyToStore, data_store);
  };

  getData = async keyToSearch => {
    let parsed_data = null;

    const storage = await AsyncStorage.getItem(keyToSearch);
    if (storage) {
      parsed_data = JSON.parse(storage);
      console.log('Data in AsyncStorage: ', parsed_data);
    }

    return parsed_data;
  };
}