alex4answ
@alex4answ

Последовательный dispatch асинхронных экшенов?

Добрый день, столкнулся с задачей:

В компонент нужно вывести данные из 2 разных (но связанных) частей стора.
Но перед выводом, данные нужно обновить.

Пример:
есть Дома (координаты и тп), а есть История Домов (кто когда жил и тп), структура store:
- houses
- - houses
- - histories ( WeakMap )

В итоге мне перед выводом страницы, нужно сначала запросить все Houses, а затем для всех этих домов запросить History.

Как это сделать?
Понимаю что можно объединить это в 1 действие, но не хочу (тк данные смешаются, будет трудно работать с ними)

Как в useEffect сначала задиспатчить загрузку домов, а после загрузки задиспатчить загрузку историй к этим домам?

что-то типа:
const dispatch = useDispatch();
const houses   = useSelector((state) => state.houses.houses);
const housesHistory = useSelector((state) => state.houses.histories);

useEffect(() => {
  dispatch(getHouses());
  dispatch(getHousesHistory(houses));
}, [dispatch, houses, housesHistory])


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

Как делать последовательные запросы redux ?
  • Вопрос задан
  • 48 просмотров
Решения вопроса 1
vovaspace
@vovaspace
Frontend Developer
Типа такого:
// запрашиваете дома при маунте компонента.
useEffect(() => {
  dispatch(getHouses());
}, [dispatch]);

// запрашиваете историю при изменении houses.
useEffect(() => {
  dispatch(getHousesHistory(houses));
}, [dispatch, houses]);


Но лучше такую логику не в компонентах держать, а выносить во что-то вроде redux-saga.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы