React Native AsyncStorage.getItem, возвращающий неопределенный

Question

Отказ от ответственности: все еще изучаю RN, впервые используя AsyncStorage.

Итак, я пытаюсь сохранить массив объектов "item" в AsyncStorage. Пользователь может создавать объекты «item», и они должны в конечном итоге отображаться в FlatList (или аналогичном компоненте) на другом экране.

Пример:

itemArray = [
{
    keywords: "box",
    size: "medium",
    color: "black",
},
{
    keywords: "pillow",
    size: "large",
    color: "white",
}]

Когда пользователь заполняет поля ввода текста и нажимает кнопку add, я вызываю функцию addItem, которая извлекает текущий itemArray из хранилища и добавляет другой объект item со значениями формы. Однако, похоже, что переменная res, возвращаемая из вызова, не определена.

Функция storeData просто вызывает AsyncStorage.setItem ().

Ошибка, которую я получаю: TypeError: Cannot read property 'data' of undefined

Вот мой код:

addItem = async () => {
        try {
            const res = await AsyncStorage.getItem('itemArray')
                .then(req => JSON.parse(req))
                .then(json => console.log(json));
            // Item array is populated, append to it
            if(res !== null) {
                console.log(res);    // Outputs undefined
                var itemArray = res.data;

                itemArray.push({"keywords": this.state.keywords, "color": this.state.color, "size": this.state.size});
                storeData(array);
            }
            // Item array is not populated, initialize and append
            else {
                console.log(res);    // Outputs undefined
                var itemArray = new Array();
                itemArray.push({"keywords": this.state.keywords, "color": this.state.color, "size": this.state.size});
                storeData(itemArray);
            }
        } catch(e) {
            // error reading value
            console.log(e);    // Outputs TypeError: Cannot read property 'data' of undefined
        }
    }

Что-то не так с функцией getItem?

Редактировать: Вот моя функция storeData, так как она может быть источником ошибки:

storeData = async (itemArray) => {
        try {
            var itemData = {
                data: itemArray,
            };
            console.log(itemData);
            await AsyncStorage.setItem('itemArray', JSON.stringify(itemData))
            console.log('success!');
        } catch (e) {
            // saving error
        }
}

Answer 1

Вам не нужно использовать функцию then, если вы используете await.

Вместо этого:

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

Do This:

const res = await AsyncStorage.getItem('itemArray');
const parsed = JSON.parse(res);

Теперь вы можете использовать переменную 'parsed' для доступа к данным внутри:

console.log(parsed.data); // should get you your data...

Answer 2

Вы используете Async - wait синтаксис ... или then ... catch ... вы не можете использовать их оба

addItem = async () => {
  const res = await AsyncStorage.getItem('itemArray');

  // do something with your res
  const resArr = JSON.parse(res);
  // ...
};