IONIC - ANGULAR 为什么点击后退按钮时我有相同的多个请求？

Question

我的页面上有后退按钮。当我停留在第 1 页并转到第 2 页时，我只有一个请求。当我单击从 PAGE 2 到 PAGE 1 的后退按钮时，我收到两个相同的请求。如果我再次转到第 2 页并返回，我会收到三个相同的请求。

为什么？

我在第 1 页上有这个

ionViewWillEnter() {

    this.route.paramMap.subscribe(paramMap => {
      if (!paramMap.has('id_store')) {
        this.location.back();
        return;
      }
    this.isLoading = true;

    this.atv_id = paramMap.get('id_store');


        this.loadingCtrl
        .create({ keyboardClose: true, message: 'Carico categorie...' })
        .then(loadingEl => {
          loadingEl.present();

          this.subcriber = this.ristoserv.postRistoCategories(this.atv_id).subscribe( (response: any ) => {

            // check zona selezionata
            this.storage.getObject('zoneData').then((data: any) => {
            });

            this.categories = response;
            this.IdType = paramMap.get('id_type');

            this.isLoading = false;
            loadingEl.dismiss();

          }, errRes => {

            loadingEl.dismiss();
            const code = errRes.error.error.message;
            console.log('error', code);
            this.isLoading = true;

          });
        });
    });
  };

Answer 1

每次调用 ionViewWillEnter() 都会创建新的路由订阅。你应该退订它。

创建属性

private unsubscribe$ = new Subject<void>();

用它来退订

this.route.paramMap
  .pipe(takeUntil(this.unsubscribe$))
  .subscribe(paramMap => {

并在组件销毁时发出它。

ngOnDestroy() {
  this.unsubscribe$.next();
}

您可以使用库 @ngneat/until-destroy.

更轻松地做到这一点

或者只需确保只初始化一次：如果您只更改路由器中的参数，它可能不会重新创建您的组件 - 取决于 onSameUrlNavigation 配置。

如果你显示 how/when 你调用 ionViewWillEnter() 会有所帮助。

IONIC - ANGULAR 为什么点击后退按钮时我有相同的多个请求？

IONIC - ANGULAR Why when click back button I have same multiple request?

back-button

ionic-framework

angular