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

更改页面时未触发ionViewDidLeave和ionViewDidEnter

2 个答案: