Как ленить данные загрузки в приложении Redux?

Question

Скажем, я получил

IClientState: { 
    firstName: string, 
    lastName: string, 
    details: IClientDetailsState 
} 

и давайте далее предположим, что получение firstName и lastName от службы дешево, так что действие будет загружать все клиенты в одном Скверны развертки в родительском состоянии

xxxxState: { 
    clients: IClientState[], 
    ... 
} 

Однако получение details для любого одного клиента довольно дорогое, и они, разумеется, не нужны для отображения в списке.

Как это сделать? Я думал о добавлении loading и loaded свойствам к IClientDetailsState и проверке для тех в компоненте, который требует этих данных; этот компонент затем запустит действие lo load details, если оба свойства должны дать false.

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

Итак, как я могу справиться с этим надлежащим образом?

Answer 1

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

Я хотел бы решить эту проблему путем введения некоторых новых типов, например:

IClientBase: { 
    firstName: string, 
    lastName: string 
} 

IClientListItem extends IClientBase: { 
    index: integer 
} 

IClientList{ 
    items: IClientListItem[] 
} 

IClient extends IClientBase{ 
    details: IClientDetails 
} 

Теперь вы можете собрать список дешевых IClientListItem и когда пользователь выбирает элемент, который вы можете преобразовать его в IClient и надуть с соответствующие данные клиента.