Ionic 4 在生命周期事件中导航，防止在重新加载时显示页面答案

【问题标题】：Ionic 4 navigate in lifecycle event, prevent showing page on reloadIonic 4 在生命周期事件中导航，防止在重新加载时显示页面
【发布时间】：2019-04-03 01:56:47
【问题描述】：

我有一个页面，除非用户登录（帐户详细信息），否则该页面不应加载。但是，如果用户访问该直接 URL，我更愿意将他定向到登录页面。目前我正在这样做：

ionViewWillEnter() { 
  if (notLoggedIn()){
    this.navCtrl.navigateRoot('/tabs/(account:account/login)');
    console.log('No user defined when at registration page, redirecting');
    }
  }

我让控制台记录，但页面没有导航到正确的页面（URL 更改，但旧页面显示）。

【问题讨论】：

标签： angular ionic-framework angular-router ionic4

【解决方案1】：

一些 Ionic 生命周期事件在 Ionic 4 中没有触发，我认为是由于切换到 Angular 路由而不是 Ionic 路由。特别是在 NavController 文档中，它显示 ionViewCanEnter 使用 navCtrl.push 方法，而不是 navCtrl.navigateRoot 或 forwards/backwards 的新方法（这是我在上面输入之前第一次尝试的方法）。

所以，为了解决这个问题，我使用了普通的 Angular 路由生命周期保护，但坚持使用 Ionic NavController 进行导航。我创建了一个新的生命周期守卫，如图所示：

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean {

    if (this.userService.isLoggedIn()) { return true; }
    this.navCtrl.navigateRoot('/tabs/(account:account/login)');
    return false;

  }

效果很好。

很好的文档here 适合任何一起学习 Ionic 和 Angular 的人

【讨论】：