ionic 3 菜单在 setRoot 后不显示

Question

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

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

尝试：

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

Answer 1

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

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

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

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

点击菜单按钮，您将看到菜单屏幕。

检查此代码：

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

openCart(){

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

  }

第二步：在登录页面更新您的登录方式

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

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

中的以下代码

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

以上变化希望您能理解

Answer 2

如果您从任何页面导航到第一页 (HomePage) 并且您使用 navCtrl.setRoot(HomePage)；首先使用 navCtrl.remove(indexOfFirstPageAfterHomePage,numberOfPagesToRemove)

删除该页面之前的所有其他页面

示例：

主页 => 查看个人资料页面 => 编辑个人资料页面 => 确认页面

使用 navCtrl.setRoot(HomePage) 从 ConfirmationPage 导航回 HomePage；先移除 ViewprofilePage、EditprofilePage，否则侧边菜单将不会在主页上打开。

使用 navCtrl.remove(1,2).

删除两者

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

ionic 3 菜单在 setRoot 后不显示

ionic 3 menu does not show up after setRoot

ionic3

angular

ion-menu

ion-nav