Как правильно выполнить действие asyn c с использованием наблюдаемого redux и firebase? - PullRequest
0 голосов
/ 29 мая 2020

так что у меня есть этот epi c

export const listenToCountryVisitsEpic = (action$, store) => {
    return action$.pipe(
        ofType('UPDATE_TRIP_DETAILS'),
        mergeMap((action) => {
            const userId = store.value.user.id
            const { country, newDetails } = action
            const { people, places } = details
            const scheme = {
                people,
                places,
            }

            firebase.database().ref(`users/${userId}/path`).update(scheme)

            return mergeMap((response) => {
                const payload = { ...JSON.parse(response.request.body), currentDetails: action.currentDetails }
                return [updatedCountrySuccess(payload)]
            })
        }),
    )
}

то, что я хочу сделать, это сделать запрос в firebase, а затем в случае успешного обновления redux, которое, в свою очередь, обновит реакцию. если не удалось, то поймайте это

это правильно отправляет в firebase, но мне нужно правильно ловить ошибки. Я не хочу запускать это: updatedCountrySuccess, пока я не узнаю, что это успех или неудача в firebase

могу ли я использовать async / await для этого?

1 Ответ

0 голосов
/ 29 мая 2020

Вы можете использовать from(), чтобы превратить Promise в Observable, а затем catchError, чтобы заменить ошибку на что угодно.

import { from } from 'rxjs';
import { catchError } from 'rxjs/operators';

...

return action$.pipe(
    ofType('UPDATE_TRIP_DETAILS'),
    mergeMap((action) => {
        const userId = store.value.user.id
        const { country, newDetails } = action
        const { people, places } = details
        const scheme = {
            people,
            places,
        }

        return from(firebase.database().ref(`users/${userId}/path`).update(scheme))
            .pipe(
                // `mergeMap` will handle only `next` notifications
                mergeMap((response) => {
                    const payload = ...
                    return [updatedCountrySuccess(payload)]
                }),
                catchError(error => of(errorAction)),
            );
    }),
)
...