Question

我是Ionic 4的新手，我想弄清楚我做错了什么，或者Ionic 4在这方面的表现是否有所不同。我有一个非常简单的应用程序，其中只有几个离子页面，在app.component.ts文件中，我在platform.ready()调用中触发了一些初始化逻辑。我注意到通过ionic serve进行测试时，每次加载页面时都会触发该初始化代码。下面是一些代码。我假设ionic serve仅在代码更改时才重新加载应用程序（而不是在每次导航到新页面时）？也许我的导航方法导致应用重新加载？

app.component.ts

  constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar
  ) {
    this.initializeApp();
  }

  initializeApp() {
    this.platform.ready().then(async () => {
      this.statusBar.styleDefault();
      this.splashScreen.hide();

      let time = new Date().toLocaleString();
      console.log(`${time}: Platform is ready...dude`);
    });
  }

简单的导航，可以加载各种空白页面（并且似乎在每个导航上都触发了应用的重新加载）。

Home.page.html

<ion-content padding>
<h1>Home Page</h1>
  <ul>
    <li><a href="/home" routerDirection="root">HOME</a></li>
    <li><a href="/login" routerDirection="root">login</a></li>
    <li><a href="/profile" routerDirection="root">profile</a></li>
    <li><a href="/signup" routerDirection="root">signup</a></li>
    <li><a href="/account" routerDirection="forward">accounts</a></li>    
    <li><a href="/admin" routerDirection="forward">admin</a></li>
  </ul>
</ion-content>

app-routing.module.ts

const routes: Routes = [
  { path: '', redirectTo: 'home', pathMatch: 'full' },
  { path: 'home', loadChildren: './pages/home/home.module#HomePageModule' },
  { path: 'login', loadChildren: './pages/login/login.module#LoginPageModule' },
  { path: 'profile', loadChildren: './pages/profile/profile.module#ProfilePageModule' },
  { path: 'account-detail/:id', loadChildren: './pages/account-detail/account-detail.module#AccountDetailPageModule' },
  { path: 'account', loadChildren: './pages/account/account.module#AccountPageModule' },
  { path: 'settlement', loadChildren: './pages/settlement/settlement.module#SettlementPageModule' },
  { path: 'signup', loadChildren: './pages/signup/signup.module#SignupPageModule' },
  { path: 'admin', loadChildren: './pages/admin/admin.module#AdminPageModule' },
];

Answer 1

菜鸟错误。我正在发布答案，以防其他任何人偶然发现。

我的问题是锚标记。显然，我不熟悉角路由器。看起来，如果您提供了routerLink，它将按照“正常” SPA链接（而不是重新加载应用程序）的预期进行操作。

更新的首页

<ion-content padding>
<h1>Home Page</h1>
  <ul>
    <li><a [routerLink]="['/home']" routerDirection="root">HOME</a></li>
    <li><a [routerLink]="['/login']" routerDirection="root">login</a></li>
    <li><a [routerLink]="['/profile']" routerDirection="root">profile</a></li>
    <li><a [routerLink]="['/signup']" routerDirection="root">signup</a></li>
    <li><a [routerLink]="['/account']" routerDirection="forward">accounts</a></li>    
    <li><a [routerLink]="['/admin']" routerDirection="forward">admin</a></li>
  </ul>
</ion-content>

Ionic 4：每页离子服务都会重新加载应用程序

1 个答案: