Управление зависимостью данных Redux

Question

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

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

Как структурировать компонент для его обработки? До сих пор я думал, что-то вроде:

({event, conflictingEvents,fetchEvent, fetchConflictingEvents}) => { 
    if (!event || !conflictingEvents) { 
     if (!event) fetchEvent(); 
     if (!conflictingEvents) fetchConflictingEvents(event.start, event.end) 
      return (/* empty state */); 
    } 
    return (/* actual state */); 

Проблема с вышесказанным, что это зависит от кэширования, чтобы не создавать бесконечный цикл.

Answer 1

Если я правильно вас понимаю, вы пытаетесь организовать несколько асинхронных HTTP-вызовов и обновлять состояние своего приложения, когда вы идете, правильно?

---

идиоматические подход к решению этой задачи будет использования async actions. Это позволяет вам запускать процедуру загрузки из ваших компонентов React посредством одной отправки вашего асинхронного действия. Это асинхронное действие затем координирует вызовы на ваш сервер и сопоставление данных между вызовами.

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

В результате у вас есть , инкапсулировавший оркестровку ваших вызовов API полностью. Ни компонент React, который отображает ваше приложение, ни ваши редукторы не должны знать о порядке вызовов, или какую информацию вы передаете между ними. Для них имеет значение только промежуточный и конечный результат ваших вызовов, которые должны быть частью вашего состояния.

---

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