离子 3 菜单在 setRoot 后不显示

Question

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

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

尝试：

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

Answer 1

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

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

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

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

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

检查此代码：

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

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

步骤2：在登录页面中更新您的登录方法

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

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

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

希望您能理解上述更改。

Answer 2

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

例：

首页 => 查看个人资料页面 =>

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

要使用 navCtrl.setRoot(HomePage( 从确认页面导航回主页;请先删除 ViewprofilePage，先编辑配置文件页面，否则侧边菜单将不会在主页上打开。

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

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