在高分辨率下默认关闭 ion-menu | Angular & Ionic 4

Question

我正在开发一款适用于iOS设备的应用程序，包括平板电脑和智能手机。我希望菜单默认是关闭的，用户可以自行决定何时打开它。

在iPad Air和iPhone上，菜单显示正常。但是当我在iPad Pro上启动应用程序时，由于分辨率过高，菜单总是可见的。 （菜单会自动打开）：

（菜单正确地在启动时关闭）：

因此，我的菜单代码如下：

  <ion-split-pane class="actionApp">
  <ion-menu side="start">  
      <ion-header>
        <ion-toolbar>
          <ion-title>Menu</ion-title>
        </ion-toolbar>
      </ion-header>
      <ion-content>
        <ion-list>
          <ion-item (click)="goToPage('/homepage')">
            <ion-icon name="home" slot="start"></ion-icon>
            <ion-label>Home</ion-label>
          </ion-item>
          <ion-item>
            <ion-icon name="person" slot="start"></ion-icon>
            <ion-label>Profile</ion-label>
          </ion-item>
          <ion-item>
            <ion-icon name="chatbubbles" slot="start"></ion-icon>
            <ion-label>Messages</ion-label>
          </ion-item>
          <ion-item>
            <ion-icon name="settings" slot="start"></ion-icon>
            <ion-label>Settings</ion-label>
          </ion-item>
        </ion-list>
      </ion-content>
    </ion-menu>
<!-- <div class="loading">
  <ion-progress-bar class="loading-background" color="light" type="indeterminate"></ion-progress-bar>
</div> -->
<ion-router-outlet main></ion-router-outlet>    

如何关闭菜单？ 谢谢

- Mr. Developer

Answer 1

您需要移除 <ion-split-pane> 标签。

根据文档:

当创建多视图布局时，分割窗格非常有用。 它允许在视口宽度增加时显示 UI 元素，例如菜单。

链接到 ion-split-pane 文档

- Mauro Semproni

Answer 2

是的，正如Mauro所说，在app.component.html中删除这2行。

 <ion-split-pane contentId="main-content">
  </ion-split-pane>

- Randy