Проблема множественной подписки NGRX с Ioni c 4 - PullRequest
0 голосов
/ 29 апреля 2020

Я использую ioni c 4 с ngrx. У меня есть пользовательский селектор на странице A и странице b.

export class ComponentA implements OnInit, OnDestroy {

  private readonly ngUnsubscribe: Subject<void> = new Subject<void>();
  user:any;
  constructor(
    private readonly store: Store<AppState>,
  ) { }

ngOnInit(){}

  ionViewWillEnter(): void {
    this.store.select(getUserState)
      .pipe(takeUntil(this.ngUnsubscribe))
      .subscribe((user) => {
        this.user = user;
      });
  }

  ionViewWillLeave(): void {
    this.ngUnsubscribe.next();
    this.ngUnsubscribe.complete();
    getUserState.release();
  }  

Те же подписки на странице b, когда я перехожу со страницы a на b, отмена подписки работает, но потом, когда я перехожу с b на a и затем на a .. подписка на странице a не отменяется. , Если вы вернетесь назад 5 раз, 5 подписок останутся на странице а. На обеих страницах появится уведомление. Я знаю, что в ioni c предыдущая страница остается в стеке, поэтому onDestroy () никогда не вызывается при прямой навигации, поэтому я включил подписку и отписку в виде ловушек ioni c lifecyle. Подскажите пожалуйста как это исправить. Заранее спасибо.

1 Ответ

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

Проблема в том, что после того, как самый первый отпуск this.ngUnsubscribe завершен, это означает, что в следующий раз, когда ionViewWillLeave будет вызван, this.ngUnsubscribe завершится и не будет выдавать сигнал завершения.

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

export class ComponentA implements OnInit, OnDestroy {

  private readonly ngUnsubscribe: Subject<void> = new Subject<void>();
  user:any;
  constructor(
    private readonly store: Store<AppState>,
  ) { }

  ngOnInit(){}

  ionViewWillEnter(): void {
    this.store.select(getUserState)
      .pipe(takeUntil(this.ngUnsubscribe))
      .subscribe((user) => {
        this.user = user;
      });
  }

  ionViewWillLeave(): void {
    this.ngUnsubscribe.next();
    getUserState.release();
  }

  ngOnDestroy(): void {
    this.ngUnsubscribe.complete();
  }
}
...