操作和还原结构应该如何使来自2个单独API的数据可以显示在同一页面上？

Question

action.js

export const getSeverityDistData = (dispatch, urlqueryStr) => {
handleFetch(
    {
        ...getSeverityDist(),
        urlqueryStr,
    }, // fetch params
    (res) => {
        dispatch({
            type: ActionTypes.GET_DASHBOARD_LIST_SUCCESS,
            payload: {
                data: res.data,
                isLoading: false,
                onError: false,
            },
        });
    },
    (e) => {
        dispatch({
            type: ActionTypes.GET_DASHBOARD_LIST_ERROR,
            payload: {
                errorMsg: e.message,
                isLoading: false,
            },
        });
    },
    (loading) => {
        dispatch({
            type: ActionTypes.GET_DASHBOARD_LIST_LOADING,
            payload: loading,
        });
    }
);};
export const getGroupData = (dispatch, urlqueryStr) => {
handleFetch(
{
    ...getGruop(),
    urlqueryStr,
},//...sameOperations SameActionTypes...}

reducers.js

const setChartsData = (state, action) => ({
    ...state,
    data: [...action.payload.data],
    isLoading: action.payload.isLoading,
    onError: action.payload.onError,
});

const setLoading = (state, action) => ({
    ...state,
    isLoading: action.payload,
});

const setTimeOut = (state, action) => ({
    ...state,
    isTimeout: action.payload,
});

const onError = (state, action) => ({
    ...state,
    onError: action.payload.errorMsg,
    isLoading: action.payload.isLoading,
});

const initialState = {
    data: [],
    isLoading: false,
    isTimeout: false,
    onError: '',
};

export default (state = initialState, action) => {
    switch (action.type) {
        case ActionTypes.GET_DASHBOARD_LIST_SUCCESS:
            return setChartsData(state, action);
        case ActionTypes.GET_DASHBOARD_LIST_LOADING:
            return setLoading(state, action);
        case ActionTypes.GET_DASHBOARD_LIST_TIME_OUT:
            return setTimeOut(state, action);
        case ActionTypes.GET_DASHBOARD_LIST_ERROR:
            return onError(state, action);
        default:
            return state;
    }
};

让我简要告诉你我想做什么。 考虑一页上的2个图表。这些图表的数据来自不同的API，但根据UI的相同过滤器。 例如，用户将从“过滤器”部分中选择某些参数，并且根据此过滤状态将查询发送到API，每个API将返回其自己的数据，这些不同的数据将在同一图上以不同的图表显示页。我要做的是通过图将数据与API分开。当我按照上面写的交易进行交易时，我会从商店中提取的值更改。我猜哪个出现的覆盖物。我该如何摆脱这种情况？