Хранение нормализованных данных в Redux - PullRequest
Новая
       3

Хранение нормализованных данных в Redux

2 голосов
/ 02 июля 2019

Когда я делаю свой запрос API, я получаю глубоко вложенный объект с сервера, прочитав об этом, это плохая практика для Redux хранить данные вложенного объекта, поэтому я использую Normalizr для этого объекта, который возвращает мне много разныхлица.

Проблема, с которой я сталкиваюсь, заключается в том, чтобы сделать этот запрос внутри моего действия.Как эффективно хранить каждую сущность в отдельном редукторе.

action.ts 

export const fetchClaim = (claimId: string) => async (dispatch: any) => {
    dispatch({ type: REQUEST_CLAIM, payload: true });

    try {
        const response = await req.get(`claim/${claimId}`);

        const normalizedData = normalize(response.data, Claim);

        dispatch({ type: SET_LIABILITY, payload: normalizedData.entities.LiabilityType });
        dispatch({ type: SET_CLAIM_STATUS, payload: normalizedData.entities.ClaimStatus });
        dispatch({ type: SET_CLAIM, payload: normalizedData.entities.Claim });
        dispatch({ type: SET_ACTIONS, payload: normalizedData.entities.Actions });
    } catch (e) {}
}

У меня в папке редуктора есть файл index.ts, который объединяетредукторы. 

import  { combineReducers } from 'redux';

import claimReducer from './claimReducer';
import actionReducer from './actionReducer';
import liabilityReducer from './liabilityReducer';
import claimStatusReducer from './claimStatusReducer';

export default combineReducers({
    claim: claimReducer,
    actions: actionReducer,
    liability: liabilityReducer,
    claimStatus: claimStatusReducer
});

Наконец, каждый редуктор выглядит идентично с точки зрения хранения своих данных. 

import { LiabilityActionTypes, LiabilityState } from "../types/Liability";

const INITIAL_STATE: LiabilityState = {
    liability: null
}

// State - Returns what the state was when this reducer was previously ran.
// Action - This is what the action creator dispatched.
export default (state = INITIAL_STATE, action: LiabilityActionTypes): LiabilityState => {
    switch (action.type) {
        case 'SET_LIABILITY':
            return { ...state, liability: action.payload };
        default:
            return state;
    }
}

Мой вопрос, кажется неправильным, что если у меня около 40сущности, которые мне нужно вызвать dispatch 40 раз внутри действия fetchClaim.Есть ли лучшая практика для достижения этой цели?

...