RX JS избегать вложенных множественных подписок - PullRequest
Новая
       36

RX JS избегать вложенных множественных подписок

1 голос
/ 04 мая 2020

Я хотел бы преобразовать приведенный ниже фрагмент кода: 

 this.dataUserSubscription = this.store$.pipe(select(selectUser)).subscribe(
            user => {
                this.store$.pipe(select(selectUserData, {user}), take(1))
                    .subscribe(userData => {
                        if (userData === null) {
                            this.store$.pipe(select(selectUserManagement, {user}), take(1)).subscribe(
                                userManagement => {
                                    this.store$.dispatch(saveUserDataToStore({
                                        user,
                                        userManagement
                                    }));
                                });
                        }
                    });

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

 this.dataUserSubscription = this.store$.pipe(select(selectUser),
    switchMap(user => this.store$.pipe(select(selectUserData, {user}))))
    .subscription(userData => {
        // logic
    })

Но это не правильное решение для моего примера кода. Почему правильный шаг для исправления нескольких вложенных подписок?

1 Ответ

1 голос
/ 04 мая 2020

за Rx JS лучшие практики, ваш второй пример - вполне приемлемый подход.

Но, следуя рекомендациям NgRx, вы можете избавиться от вложенной подписки, просто комбинируя селекторы.

Трудно точно сказать , что делать, не видя selector файлов, но если у вас уже есть user в хранилище, то вы сможете извлечь пользовательские данные из хранилища без 2-х вызовов селектора.

Может быть что-то вроде: 

const getDataForUser = createSelector(
    selectUser,
    selectUsers,
    (user, userDataDictionary) => userDataDictionary[user.id]
)

Тогда просто используйте один селектор getDataForUser.

...