离子 3 菜单在 setRoot 后不显示答案

【问题标题】：ionic 3 menu does not show up after setRoot离子 3 菜单在 setRoot 后不显示
【发布时间】：2018-03-21 06:57:36
【问题描述】：

在我的用例中，我想在我的 ionic 3 angular 应用程序中显示侧边菜单和选项卡。用例是：最初显示带有隐藏侧菜单的选项卡（设置为启用（假））。第一个页面显示了一个添加到购物车的按钮，这样做会在标题区域显示一个购物车，然后单击购物车会显示一个登录页面。一旦你登录，订单摘要页面就会出现。此时我想显示侧面菜单。所以在ionviwedidload 中，我设置了menu.enable(true)。虽然它显示了菜单图标，但实际菜单并没有出现。

最小的测试用例是https://www.dropbox.com/s/tq202w3p6yf32fj/tab-menu_app.zip?dl=0

尝试：

1. 运行应用程序
2.点击加入购物车按钮
3.点击右侧标题中的购物车
4.这带来了登录页面模型。点击登录按钮
5. 摘要页面显示菜单图标。虽然点击它没有任何作用

【问题讨论】：

@CodeChanger 他是绝对正确的

标签： angular ionic3 ion-menu ion-nav

【解决方案1】：

我检查了您的代码，根据我的理解，您需要更改导航流程。

当您将 OrderSummaryPage 页面设置为 root 视图时，由于此应用无法在您的屏幕上显示菜单。

要解决此问题，您需要从主页推送OrderSummaryPage，那里有两个选项

隐藏后退按钮并显示菜单按钮。
不要在那里显示菜单按钮，只显示默认的后退按钮，当用户点击后退时，它会回到主屏幕，您将在此处获得菜单按钮。

通过单击菜单按钮，您将获得菜单屏幕。

检查此代码：

第 1 步：更新您的 OpenCart 方法：

openCart(){

    let loginModal = this.modalCtrl.create(LoginPage, { userId: 8675309 });
    loginModal.onDidDismiss(data => {
      console.log(data);
      this.navCtrl.push(OrderSummaryPage);
    });
    loginModal.present();

  }

第 2 步：在 LoginPage 中更新您的登录方法

login(){
    this.viewCtrl.dismiss()
}

现在，如果您想隐藏 OrderSummeryPage 上的后退按钮，请使用以下代码

<ion-navbar hideBackButton="true"> // for hiding back button.

希望你能理解以上的变化。

【讨论】：

【解决方案2】：

如果您从任何页面导航到第一个页面 (HomePage) 并且您使用 navCtrl.setRoot(HomePage);首先使用 navCtrl.remove(indexOfFirstPageAfterHomePage,numberOfPagesToRemove) 删除该页面之前的所有其他页面

例子：

HomePage => ViewprofilePage => EditprofilePage => ConfirmationPage

使用 navCtrl.setRoot(HomePage) 从 ConfirmationPage 导航回 HomePage;请先删除 ViewprofilePage、EditprofilePage，否则将无法在 HomePage 上打开侧边菜单。

使用 navCtrl.remove(1,2) 删除两者。

它对我有用。希望对你有帮助?

【讨论】：