首页 > 解决方案 > 注销时自动隐藏侧边菜单

问题描述

所以基本上我试图禁用登录页面上的侧边菜单。我正在这样做并且它正在工作。

login.page.ts:

ngOnInit() {
  this.menu.enable(false);
}

但是当我注销时,如果我向左滑动,侧边菜单仍然可用。注销功能:

logout(){
    localStorage.clear();
  this.navCtrl.navigateRoot('login');
  }

HTML 代码:

<ion-app>
  <ion-split-pane>
    <ion-menu>
      <ion-header>
        <ion-toolbar>
          <ion-title>Menu</ion-title>
        </ion-toolbar>
      </ion-header>
      <ion-content>
        <ion-list>
          <ion-menu-toggle auto-hide="false" *ngFor="let p of appPages">
            <ion-item [routerDirection]="'root'" [routerLink]="[p.url]">
              <ion-icon slot="start" [name]="p.icon"></ion-icon>
              <ion-label>
                {{p.title}}
              </ion-label>
            </ion-item>         
          </ion-menu-toggle>
        </ion-list>
        <ion-button (click)="logout()">Sair</ion-button>
      </ion-content>
    </ion-menu>
    <ion-router-outlet main></ion-router-outlet>
  </ion-split-pane>
</ion-app>

标签: angulartypescriptionic-framework

解决方案


ngOnInit()当组件被加载时,钩子只会被调用一次。

在注销功能中使用ngOnChanges()挂钩或禁用菜单。

当您使用离子框架时,请使用ionViewDidEnter()钩子。

ionViewDidEnter(){
     if(...not-logged-in...){
          this.menu.enable(false);
     } else {
          this.menu.enable(true);
     }
}

推荐阅读