IONIC Tabs navbar出现在子页面中为什么？

Question

这是我的标签导航栏，这也与我的其他子页面重叠

<ion-header>
  <ion-navbar hideBackButton="true">
    <span class="hdr-clr">Winkrr</span>
    <ion-buttons start>
      <button ion-button icon-only>
        <ion-icon style="color:#ed145b;" name="ios-search"></ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button ion-button icon-only>
        <ion-icon style="color:#ed145b;" name="ios-notifications-outline"></ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button ion-button icon-only>
        <ion-icon style="color:#ed145b;" name="ios-contact-outline"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>
<ion-tabs tabsPlacement="top" tabsHideOnSubPages="true" primary>
  <ion-tab tabIcon="md-globe" [root]="tab1Root"></ion-tab>
  <ion-tab tabIcon="stats" [root]="tab2Root"></ion-tab>
</ion-tabs>

这是我的子页面导航栏

<ion-header>

  <ion-navbar hide-tabs>
    <ion-title>personal-chat</ion-title>
  </ion-navbar>

</ion-header>

这就是我的导航方式

  onContact(){
    this.navCtrl.push(PersonalChatPage);
  }

我已经在离子2中使用了单页的选项卡。我已经将离子导航栏用于标签页，这对于两个标签是常见的。但子页面上会出现相同的导航栏

Answer 1

您可以尝试在app.module.ts中设置配置，如下所示：

 imports: [
        IonicModule.forRoot(MyApp, {
            // Tabs config
            tabsHideOnSubPages: true,
            ...
        })
    ]