Повторный рендеринг не запускается после обновления состояния редукции. ⇐ Javascript
-
Гость
Повторный рендеринг не запускается после обновления состояния редукции.
Я использую redux-observable и пытаюсь получить события после завершения действия обновления событий.
update-events.js
import { mergeMap, switchMap, from } из 'rxjs/operators'; импортировать { ofType } из 'redux-observable'; импортировать { showGlobalMessage } из «src/actions/system»; импортировать { setEvents, toggleEvents } из 'src/actions/regulator-events'; импортировать { getRegulatorEvents, updateRegulatorEvents } из 'src/api/svc'; импортировать {actionObservableOf} из 'src/helpers/redux-observable-helper'; импортировать { getGlobalMessageByStatus } из 'src/helpers/system'; импортировать { NOTIFICATION_TYPES } из «src/constants»; импортировать { catchErrorWithAuth } из '../_operators/common'; экспортировать const toggleRegulatorEventStatusEpic = (action$, state$, { ajax }) => действие$.pipe( ofType(toggleEvents), switchMap(({ полезная нагрузка }) => { вернуть updateRegulatorEvents(ajax, payload).pipe( mergeMap(() => { const SuccessAction = showGlobalMessage(NOTIFICATION_TYPES.SUCCESS, 'Событие регулятора обновлено успешно!'); const currentFilters = state$.value.regulatorEvents.filters; return getRegulatorEvents(ajax, currentFilters).pipe( mergeMap((ответ) => { const setEventsAction = setEvents({ события: ответ, }); return from([successAction, setEventsAction]); }) ); }), catchErrorWithAuth(({ответ }) => { const {статус} = ответ || {}; вернуть действияObservableOf(showGlobalMessage(NOTIFICATION_TYPES.ERROR, getGlobalMessageByStatus(статус))); }) ); }) ); events.jsx
экспортировать константные события = () => { константная отправка = useDispatch(); const filter = useSelector(R.path(['regulatorEvents', 'filters'])); constevents = useSelector(R.path(['regulatorEvents', 'items'])); const {open, setData} = useModal (MODAL_IDS.REGULATOR_EVENTS); console.log(события); возвращаться ( диспетчеризация(getEvents(фильтры))} /> { открыть(); setData(events.find((e) => e.eventId === val)); })} разбивка на страницы = {ложь} /> ); };
events-modal.jsx
export const EventsModal = () => { const {закрыть, данные} = useModal(MODAL_IDS.REGULATOR_EVENTS); константная отправка = useDispatch(); const updateEvent = async () => { отправлять( toggleEvents({ идентификатор события: data.eventId, betradarId: Число (formData.betradarId), доступно: formData.available, созданоAt: data.createdAt, имя_события: data.имя_события, }) ); закрывать(); }; возвращаться ( Идентификатор Betradar Разрешение ); }; Когда я вызываю toggleEvents, он успешно выполняет вызов API, но когда дело доходит до второго действия «setEvents», пользовательский интерфейс не обновляется.
Я использую redux-observable и пытаюсь получить события после завершения действия обновления событий.
update-events.js
import { mergeMap, switchMap, from } из 'rxjs/operators'; импортировать { ofType } из 'redux-observable'; импортировать { showGlobalMessage } из «src/actions/system»; импортировать { setEvents, toggleEvents } из 'src/actions/regulator-events'; импортировать { getRegulatorEvents, updateRegulatorEvents } из 'src/api/svc'; импортировать {actionObservableOf} из 'src/helpers/redux-observable-helper'; импортировать { getGlobalMessageByStatus } из 'src/helpers/system'; импортировать { NOTIFICATION_TYPES } из «src/constants»; импортировать { catchErrorWithAuth } из '../_operators/common'; экспортировать const toggleRegulatorEventStatusEpic = (action$, state$, { ajax }) => действие$.pipe( ofType(toggleEvents), switchMap(({ полезная нагрузка }) => { вернуть updateRegulatorEvents(ajax, payload).pipe( mergeMap(() => { const SuccessAction = showGlobalMessage(NOTIFICATION_TYPES.SUCCESS, 'Событие регулятора обновлено успешно!'); const currentFilters = state$.value.regulatorEvents.filters; return getRegulatorEvents(ajax, currentFilters).pipe( mergeMap((ответ) => { const setEventsAction = setEvents({ события: ответ, }); return from([successAction, setEventsAction]); }) ); }), catchErrorWithAuth(({ответ }) => { const {статус} = ответ || {}; вернуть действияObservableOf(showGlobalMessage(NOTIFICATION_TYPES.ERROR, getGlobalMessageByStatus(статус))); }) ); }) ); events.jsx
экспортировать константные события = () => { константная отправка = useDispatch(); const filter = useSelector(R.path(['regulatorEvents', 'filters'])); constevents = useSelector(R.path(['regulatorEvents', 'items'])); const {open, setData} = useModal (MODAL_IDS.REGULATOR_EVENTS); console.log(события); возвращаться ( диспетчеризация(getEvents(фильтры))} /> { открыть(); setData(events.find((e) => e.eventId === val)); })} разбивка на страницы = {ложь} /> ); };
events-modal.jsx
export const EventsModal = () => { const {закрыть, данные} = useModal(MODAL_IDS.REGULATOR_EVENTS); константная отправка = useDispatch(); const updateEvent = async () => { отправлять( toggleEvents({ идентификатор события: data.eventId, betradarId: Число (formData.betradarId), доступно: formData.available, созданоAt: data.createdAt, имя_события: data.имя_события, }) ); закрывать(); }; возвращаться ( Идентификатор Betradar Разрешение ); }; Когда я вызываю toggleEvents, он успешно выполняет вызов API, но когда дело доходит до второго действия «setEvents», пользовательский интерфейс не обновляется.
Мобильная версия