forEach - добавление ключа / значения в action.data в Redux - console.log работает, но состояние Redux не обновляется - PullRequest
0 голосов
/ 04 мая 2020

Внутри асинхронного действия c Redux Я собираю некоторые данные, используя graphQL, а затем вызываю другое асинхронное действие c, которое зацикливается в объекте (используя forEach) и добавляет некоторые ключи.

В UserTopicActions.js:


export const sendGetUserTopicSuccess = data => ({
    type: action_types.SEND_GET_USER_TOPIC_SUCCESS,
    data
});
 ...

export function sendGetUserTopic(user_id, nextToken = null) {
    return async (dispatch) => {
        dispatch(sendGetUserTopicBegin());
        ...
        try {
            const data = await API.graphql(graphqlOperation(gqlUserTopic.getUserTopic, variables))
            data_uri = await getCarouselImgUri(data.data.getUserTopic)
            dispatch(sendGetUserTopicSuccess(data_uri));

        } catch (err) {
            dispatch(sendGetUserTopicFailure(err));
        }
    };
}

В amplifyAsync.js:

import { Storage } from 'aws-amplify';

export default async function getCarouselImgUri(raw_data) {
    data = JSON.parse(raw_data.data)
    topics = data.topics
    // Fetching thumbnails for cards
    let card_img_uri
    topics.forEach((topic) => {
        topic['subtopics'].forEach(async (subtopic) => {
            card_img_uri = 'topic/' + topic.id + '/' + subtopic.id + '/' + 'thumbnail.jpg'
            subtopic['uri'] = await Storage.get(card_img_uri)      <------------ New Key!
        })
    })
    console.log(topics)
    return topics

}

В UserTopicReducer.js

export default (state = initialState, action) => {
    switch (action.type) {
        case SEND_GET_USER_TOPIC_BEGIN:
            return {
                ...state,
                isGettingUserTopic: true,
            };
        case SEND_GET_USER_TOPIC_SUCCESS:
            console.log(action.data)
            return {
                ...state,
                isGettingUserTopic: false,
                topics: action.data
            };
    ...

Если я утешу .log action.data в редукторе, я вижу новые ключи. С другой стороны, в состоянии и отправленном действии SEND_GET_USER_TOPIC_SUCCESS новые ключи отсутствуют.

Почему? Как добавить новые ключи в данные действия Redux asyn c?

1 Ответ

0 голосов
/ 10 мая 2020

Через несколько мучительных часов я обнаружил ошибку:

В amplifyAsync.js: Async ... wait не гарантирует, что все обещания внутри forEach() выполнены.

Я думаю, что Лучшим решением было бы поместить все обещания в массив, а затем использовать promise.all, но, поскольку я хотел сохранить ту же структуру словаря (а promise.all не работает со словарями), я временно использовал обычный для look и asyn * 1013. * Ждите. Таким образом, все запросы выполняются последовательно. Это неоптимизированное решение, но пока оно работает.

При отладке обещаний убедитесь, что вы выполнили console.log(JSON.stringify(data)), в противном случае стандартный console.log(data) может вывести значение разрешенного обещания, которое могло быть недоступно во время выполнения. ,

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...