как отправить несколько действий в одной и той же эпопее - PullRequest
Новая
       35

как отправить несколько действий в одной и той же эпопее

0 голосов
/ 16 апреля 2020

Я использую React, Redux, Redux-Observable, rx js и TypeScript. У меня есть эпи c, который создает записи. Я хочу отправить дополнительное действие из эпи c. 

export const createEpic: Epic = (action$) => action$.pipe(
    ofType(ITEMS_CREATE),
    mergeMap((action) => CoreCom.create<{Item: Item}>(
        '/items/index',
        {},
        'Item',
        action.item,
    ).pipe(
        map((response) => itemsCreateSuccess(response.response)),
        catchError(() => of(itemsCreateFailure())),
    )),
);

export const createSuccesEpic: Epic = (action$) => action$.pipe(
    ofType(ITEMS_CREATE_SUCCESS),
    map(
        () => enqueueSnackbar({
            message: 'Hello World!',
            options: {
                variant: 'success',
            },
        }),
    ),
);

Первый эпи c реагирует на действие ITEMS_CREATE. Затем он запускает вызов и возвращает ответ сервера. Затем отправляется действие ITEMS_CREATE_SUCCESS.
Дополнительно я хочу отправить действие, чтобы показать уведомление. Я закончил с двумя эпопеями.

Может ли кто-нибудь помочь мне «объединить» эти две эпопеи в одну? Или это хорошо, как есть?

Мне не удалось отправить два действия из одного эпизода c.

РЕДАКТИРОВАТЬ:

К вашему сведению: функция itemsCreateSuccess(), itemsCreateSuccess() и enqueueSnackbar() возвращают что-то похожее на это: 

export const itemsCreateSuccess = (response: Response): ItemsCreateSuccessAction => ({
    type: ITEMS_CREATE_SUCCESS,
    response,
});

они просто возвращают действия

1 Ответ

0 голосов
/ 16 апреля 2020

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

На ваш вопрос о том, как вы можете отправить эти два действия из createEpic Я вижу решение, используя mergeMap и merge на вашей второй трубе. Итак, ваш код будет выглядеть так: 

export const createEpic: Epic = (action$) => action$.pipe(
    ofType(ITEMS_CREATE),
    mergeMap((action) => CoreCom.create<{Item: Item}>(
        '/items/index',
        {},
        'Item',
        action.item,
    ).pipe(
        mergeMap(response => merge(
            of(itemsCreateSuccess(response.response)),
            of(enqueueSnackbar({ ... }))
        )),
        catchError(() => of(itemsCreateFailure())),
    )),
);
...