从选项卡转到根页面

Question

我想知道在使用标签时如何返回到appComponent 中定义的rootPage。 setRoot 方法没有按我的预期工作。当它在标签页中使用时，导航堆栈不会被清除。在“主页”上，后退按钮可见，而不是导航切换，并且显示选项卡的标题。

默认情况下，如果页面被导航，页面会被缓存并留在 DOM 中 远离但仍在导航堆栈中（a 上的退出页面 推（）例如）。它们在从 导航堆栈（在 pop() 或 setRoot() 上）。

上面的语句让我期望当我使用 setRoot 时，页面会从缓存中清除。当它用于普通页面而不是标签时，这似乎是正确的。

在标签页的类中，有一个功能，当点击按钮时，将根页设置为主页。

goToHome() {
 this.navCtrl.setRoot(HomePage);
}

如何确保当我们返回主页时没有返回按钮，并且使用的主页标题在组件的 HTML 模板中可用。

Answer 1

试试这个对我很有用

this.childNavCtrl.setRoot(HomePage);

Answer 2

就像你在docs看到的一样

请注意，每个 <ion-tab> 都绑定到 [root] 属性，就像 在上面的导航部分。那是因为每个 <ion-tab> 实际上只是一个导航控制器。 这意味着每个 选项卡有自己的历史堆栈，并注入了NavController 实例 每个标签的子@Components 对每个标签都是唯一的

因此，当将页面设置为 root 时，您使用的是该选项卡中的导航堆栈，而不是整个应用程序中的导航堆栈。这就是为什么您需要通过以下方式获取主导航堆栈：

constructor(private app: App,...) {...}

然后

yourMethod(): void {
    this.app.getRootNav().setRoot(YourPage);
}