Ionic 5菜单未显示 [英] Ionic 5 menu doesn't show up

问题描述

我有一个演示应用程序，我想在其中插入菜单.不幸的是，我无法使该菜单显示在标题中.我尝试了不同的方法，但是找不到解决方法.

I have a demo application where I want to insert a menu. Unfortunately I can't get this menu to appear in the header. I've tried different approaches, but I can't find the solution.

我的app.component.html看起来像这样:

My app.component.html looks like this:

<ion-app>
  <app-header></app-header>
  <ion-router-outlet id="main-content"></ion-router-outlet>
  <app-footer></app-footer>
</ion-app>

我的header.component.html像这样:

My header.component.html like this:

<ion-menu side="start" contentId="main-content">
  <ion-header>
    <ion-toolbar color="primary">
      <ion-buttons slot="start">
        <ion-back-button></ion-back-button>
      </ion-buttons>
      <ion-title>
        My App
      </ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-content>
    <ion-list>
      <ion-item>
        <ion-label>Account</ion-label>
      </ion-item>
      <ion-item>
        <ion-label>Start game</ion-label>
      </ion-item>
      <ion-item>
        <ion-label>Scores</ion-label>
      </ion-item>
      <ion-item>
        <ion-label>Rules</ion-label>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-menu>

插入菜单后，菜单或标题不再出现.

The menu or header no longer appears after I insert the menu.

我在做什么错了?

推荐答案

即使上下文丢失，也要在其中保留离子后退按钮或离子菜单按钮.从Ionic 4开始使用自动隐藏属性.

In order to keep the ion-back-button or ion-menu-button there even if the context is lost. Use auto-hide attribute in Ionic 4 onwards.

 <ion-menu-button auto-hide="false"></ion-menu-button>

这篇关于Ionic 5菜单未显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！