Вернуть две полезные нагрузки с двумя разными редукторами - React, Redux

Question

Я сделал два асинхронных вызова

export function getProfile(username) {
  const request = axios
    .get(`${profileUrl}/${username}`)
    .then(res => res.data)
    .catch(err => Promise.reject({ status: 500, message: "Invalid name" }))
    .then(previousRes =>
      axios
        .get(`${profileUrl}/${username}/repos`)
        .then(res => Object.assign(previousRes, res.data))
        .catch(err =>
          Promise.reject({ status: 500, message: "Something went wrong" })
        )
    );

  return { type: "GET_PROFILE", payload: request };
}

В этом случае я использую Object.assign, чтобы объединить оба ответа и вернуть их как один. Как я мог вернуть 2 разных типа, для каждого действия один. E.G GET_PROFILE и GET_SOMETHING_ELSE

Answer 1

Вы можете использовать этот шаблон для выполнения только одной операции на действие:

export const actionCreators = {
    myFunc: (param1, param2) => async (dispatch, getState) => {
        try {
            const response1 = await fetch(param1);
            const data1 = await response1.json();

            const response2 = await fetch(param2);
            const data2 = await response2.json();

            dispatch({ type: FUNC_RESPONSE_SUCCESS, data1, data2 });
        } catch (err) {
            dispatch({ type: FUNC_RESPONSE_FAIL });
        }
    },

    myOtherFunc: (param3) => async (dispatch, getState) => {
        try {
            const response3 = await fetch(param3);
            const data3 = await response3.json();
            dispatch({ type: OTHER_FUNC_RESPONSE_SUCCESS, data3 });
        } catch (err) {
            dispatch({ type: OTHER_FUNC_RESPONSE_FAIL });
        }
    }
}




export const reducer = (state, action) => {
    switch (action.type) {
        case FUNC_RESPONSE_SUCCESS:
            return {
                // logic
            };
        case FUNC_RESPONSE_FAIL:
            return {
                // logic
            };
        case OTHER_FUNC_RESPONSE_SUCCESS:
            return {
                // logic
            };
        case OTHER_FUNC_RESPONSE_FAIL:
            return {
                // logic
            };
        default:
            return state;
         }
    }
}