ionic-framework - 从根选项卡跳转到根选项卡的问题

Question

这样做的最佳方法是什么？

我有三个选择，但我不喜欢其中任何一个。

选项1：

• TabsPage 2：像“页脚”一样创建“A、B、C”</li>
• 在配置选项中禁用子页面选项卡（取出选项卡“1、2、3”）
• GO：使用“NavBar Push(Screen2)”。
• 返回：“NavBar pop()”</li>

问题：

1. 使用“Footer”而不是“ion-tab”创建选项卡“A、B、C”</li>

选项 2：

• 对“screen2”使用“模态形式”。
• 标签页 2:
  • 像“页脚”一样创建“A、B、C”</li>
  • 手动创建“后退按钮”</li>
• GO：查看模态
• 返回：关闭模式

问题：

1. 使用“Footer”而不是“ion-tab”创建选项卡“A、B、C”</li>
2. 后退按钮不会自动生成。

选项 3：

• 为“1、2、3”和“A、B、C”创建两个带有“ion-tabs”的“TabsPage”。
• 去：this.appCtrl.getRootNav().setRoot(TabsPage2)
• 返回：this.appCtrl.getRootNav().setRoot(TabsPage1)

问题：

1. “TabsPage 1”过滤选项和位置在“返回”时丢失。

Answer 1

这个链接把我带到了这个github repo，它有一个基于“ion-tab”的解决方案示例，适用于“Modals”和“Push”（参见视频中的示例）。

只需在 TabsPage1 上添加[tabsHideOnSubPages]="true"即可解决问题，如下所示：

<ion-tabs>
    <ion-tab [tabsHideOnSubPages]="true" [root]="homePage" tabIcon="home"></ion-tab>
    <ion-tab [root]="chatPage" tabIcon="chatbubbles"></ion-tab>
    <ion-tab [root]="profilePage" tabIcon="person"></ion-tab>
</ion-tabs>

我使用“push”只是因为“后退”按钮是自动生成的。

伟大的！J.巴勃罗。