当我更改页面时，ionViewDidLeave 和 ionViewDidEnter 不触发

Question

我有一个使用 Angular 7 开发的 Ionic 4 应用程序，如果我第一次进入该页面，事件 ionViewDidEnter 有效，但如果我移动到另一个页面并返回，则该事件不会触发。

我从 Angular 更改为 ngOnDestroy，这在首次加载页面时有效，但当我转到该页面并返回时也无法正常工作。

我的真正问题是我有一个登录页面和一个主页面板页面，当我从 app.component.ts 启动我的 ngOnInit 应用程序时，他会验证用户是否已登录，是否会将用户重定向到面板主页使用此代码的页面

this.router.navigate(['painel/home']);

发生这种情况时，此事件 ionViewDidEnter 和 ionViewWillEnter 在该页面出现时起作用，但是当我单击我的按钮注销时，我的应用程序清除缓存并将导航更改为该页面 auth.component.ts 这是注销的代码

public logout(refresh?: boolean): void {
    this.tokenStorage.clear();
    if (refresh) {
      this.router.navigate(['auth']);
    }
  }

简单，但是当我再次登录时，此事件 ionViewDidEnter 和 ionViewWillEnter 不会触发，我希望每次用户进入面板主页时都会触发，这是我登录应用程序的代码

async authenticationLogin() {
    const loading = await this.loadingController.create({
      message: 'Autenticando',
    });
    loading.present();

    const userModel: any = {
      afiliate_code: this.authForm.value.afiliate_code,
      device_uuid: this.device.uuid,
    };
    let companyCode: string = this.authForm.value.company_code;
    companyCode = companyCode.toUpperCase();

    this.auth.login(userModel, companyCode, this.uuidValidation).pipe(
    catchError(
      (error: any): Observable<any> => {
        loading.dismiss();
        return this.utilService.errorHandler(error);
      }))
    .subscribe( async response => {
      if (response.responseData.success === 1) {
        if (this.authForm.value.checkauth_param) {
          this.authParam = {
            afiliate_code: userModel.afiliate_code,
            companyCodeData: companyCode,
          };
          this.storageService.saveKeyStorage('param', this.authParam);
        } else {
          if (this.storageService.getKeyParamData('param')) {
            this.storageService.removeKeyStorage('param');
          }
        }
        this.submitted = false;
        setTimeout(() => {
          this.authForm.reset();
        }, 2000);
        this.router.navigate(['painel/home']);
      } else if (response.responseData.success === 2) {
        this.utilService.errorMsgAlert(response.responseData.message);
      } else if (response.responseData.success === 3) {
        const alert = await this.alertController.create({
          header: 'Atenção!',
          message: 'Você ainda não possui um dispositivo vinculado, deseja vincular este dispositivo ao seu usuário?',
          buttons: [
            {
              text: 'Não',
              role: 'cancel',
              cssClass: 'secondary'
            }, {
              text: 'Sim',
              handler: () => {
                this.uuidValidation = true;
                this.authenticationLogin();
              }
            }
          ]
        });
        await alert.present();
      } else {
        this.utilService.errorMsgAlert('Não foi possível fazer autenticação');
      }
      loading.dismiss();
    });
  }

工作正常，我做错了什么没有触发这些事件？

Answer 1

尝试使用 ionViewWillEnter，它与 ionViewDidEnter 基本相同，除了 ionViewWillEnter 在进入页面时触发，在它成为活动页面之前。

Answer 2

我用这个解决了我的问题，我使用 Angular 7 核心的代码来更改我的页面

 // import { Router } from '@angular/router';
 this.router.navigate(['painel/home']);

但是当我换成 Ionic 4 内核时

 // import { NavController } from '@ionic/angular';
 this.navController.navigateBack(['painel/home']);

现在 ionViewDidEnter 每次都被触发，我读了这篇文章并解决了我的问题。

谢谢大家

https://medium.com/@paulstelzer/ionic-4-and-the-lifecycle-hooks-4fe9eabb2864

Answer 3

您可以使用订户检测路由更改

只要您的页面显示，此代码就会运行

    import { ActivatedRoute } from '@angular/router';
    
    constructor(
        private routerActive:ActivatedRoute
      ) {}
    
    ngOnInit() {
        this.routerActive.paramMap.subscribe(paramMap => {
            if (this.router.url === "/yourURL") {

              // ***** This runs whenever your page is displayed ******

            }
        })
}

当我更改页面时，ionViewDidLeave 和 ionViewDidEnter 不触发

ionViewDidLeave and ionViewDidEnter not firing when i change pages

ionic-framework

angular

ionic4