Question

登录页面后，在我的离子应用程序中

我使用了侧面菜单。登录后，侧边菜单显示正确，但是如果我注销并没有刷新，请登录页面，侧边菜单不显示，但菜单按钮可见。

按钮：

 <ion-buttons start>
    <button ion-button icon-only menuToggle>
        <ion-icon name="menu"></ion-icon>
    </button>
 </ion-buttons>

菜单代码：

<ion-menu>
    <ion-content>
      <ion-list>
        <ion-navbar color="primary">
          <div class="row">
            <ion-title>HBLOAD</ion-title>
            <button ion-button menuClose>X</button>
          </div>
        </ion-navbar>
        <br>
        <div class="mainbody">
          <button ion-button full (click)="profile()">Profile</button>
          <button ion-button full (click)="changepin()">Change Pin</button>
          <button ion-button full (click)="changepassword()">Change Password</button>
          <button ion-button full (click)="accesslogs()">Access Logs</button>
          <button ion-button full (click)="logout()">Logout</button>
        </div>
      </ion-list>
    </ion-content>
    </ion-menu>

Answer 1

您应该在app.html文件中编写侧面菜单的代码。

和

在[content]中定义<ion-menu>属性

示例：

<ion-menu [content]="content">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content class="nav">

  </ion-content>

</ion-menu>

<!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

Answer 2

在您的app.component.html中，离子菜单应如下图所示

<ion-menu side="start" menuId="first" contentId="main">....</ion-menu>

，在 ion-menu 之后，您应该定义路由器出口，该出口应具有ID

<ion-router-outlet id="main"></ion-router-outlet>

ion-menu 的

contentId和 ion-router-outlet 的ID应该相同

Answer 3

在menu.js文件中，您必须添加以下代码：

value

在另一页面中，您具有导入menu.js文件，在其中您必须提及menu的contentid的contentid。并添加此标签

group

Answer 4

对于有一天看到的react个人来说，这是一个以编程方式打开侧边菜单的提示

import { menuController } from '@ionic/core';

menuController.open()

离子侧菜单不显示？

4 个答案: