Получение инвариантного нарушения: объекты недопустимы как дочерний элемент React - PullRequest
Новая
       13

Получение инвариантного нарушения: объекты недопустимы как дочерний элемент React

0 голосов
/ 19 апреля 2019

Мой код не работает, он всегда возвращает

Нарушение инварианта: объекты недопустимы как дочерние элементы React (найдено: объект с ключами {_40, _65, _55, _72}). Если вы хотите визуализировать коллекцию дочерних элементов, используйте массив вместо этого.

есть ли там неправильный синтаксис или логика? вот мой код: 

const asyncTest1= async() => {
    try {
        noteAction({ type: SET_LOADING, payload: true });
        const response = new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve('Async Test Load');
            }, 3000);
        });
        const adding = noteAction({ type: ADD_NOTE, payload: response });
        const setLoadingFalse = noteAction({ type: SET_LOADING, payload: false });
        const result = await Promise.all([response, adding, setLoadingFalse]);
        return result;
    } catch (e) {
        console.log(e);
    }
};

но без асинхронной / ожидающей версии мой код работает: 

  const asyncTest2= () => {
        try {
            noteAction({ type: SET_LOADING, payload: true });
            const result = new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('Async Test Load');
                }, 3000);
            });
            return result
            .then(response => noteAction({ type: ADD_NOTE, payload: response }))
            .then(response => noteAction({ type: SET_LOADING, payload: false }));
        } catch (e) {
            console.log(e);
        }
    };

1 Ответ

0 голосов
/ 21 апреля 2019

, но без асинхронной / ожидающей версии мой код работает

Эквивалент этого с синтаксисом async / await не будет использовать Promise.all, он будетбыть 

const asyncTest2 = () => {
    try {
        noteAction({ type: SET_LOADING, payload: true });
    } catch (e) {
        console.log(e);
    }
    var result = new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Async Test Load');
        }, 3000);
    });
    var response = await result;
    var response = await noteAction({ type: ADD_NOTE, payload: response }));
    return noteAction({ type: SET_LOADING, payload: false }));
};

Я не могу сказать, действительно ли это то, что вам нужно, но, по крайней мере, оно будет работать так же, как версия then.

...