Использование эффектов и выхлопной карты не работает должным образом для кнопки входа - PullRequest
Новая
       24

Использование эффектов и выхлопной карты не работает должным образом для кнопки входа

0 голосов
/ 22 марта 2019

У меня есть кнопка входа в систему, где, когда пользователь нажимает, в магазин запускается действие. Действие дает http-вызов, который затем проверяет пользователя.

Однако, похоже, это не работает в моем приложении. У меня есть спиннер, который загружается на одну секунду (то есть debounceTime (1000)), когда инициируется вход в систему. Когда я тестирую, нажимая кнопку входа в систему несколько раз, вызов входа в систему кажется обновленным, таким образом вызывая обновление продолжительности счетчика. Ожидаемое поведение состоит в том, чтобы пользователь нажимал кнопку входа в систему, и если есть какие-либо вызовы, сделанные до того, как наблюдаемое возвращается из первого вызова, все промежуточные должны быть отменены.

app.effects.ts 

@Effect()
  authenticateLogin$ = this.action$.pipe(
    ofType(AppActionTypes.SetAuthInfo),
    debounceTime(1000),
    exhaustMap((action: SetAuthInfo) => {
      const payload = action.payload;
      return this.authService
        .login(payload.username, payload.password)
        .pipe(
          map(response => {
            this.router.navigate(['/dashboard']);
            return new SetAuthInfoSuccess(response);
          }),
          catchError(error => {
            return of(new SetAuthInfoError(error));
          })
        )

Мое понимание выхлопной карты неверно? Или я что-то упускаю?

Заранее спасибо!

1 Ответ

0 голосов
/ 22 марта 2019

Код, которым вы поделились, похоже, работает, за исключением того, что я не уверен, как вы полагаетесь на вещь debounceTime().Если вы хотите реагировать только на первый щелчок за промежуток времени 1 с - вы должны использовать throttleTime.

Вот сравнение debounceTime и throttleTime против audTime

enter image description here

Хотя, если вы хотите, чтобы ваш exhaustMap внутренний вызов длился не менее 1 с - я бы посоветовал вам использовать конструкцию, например: 

exhaustMap(payload=>{
  const oneSecondTimer = timer(1000);
  const request = this.authService.login(payload);
  return forkJoin(request, oneSecondTimer, r => r);
})

Подробнее о forkJoin и exhaustMap.

И статье о более умных способах приостановки .

Надеюсь, это поможет

...