仅禁用滑动以打开离子菜单,而不是滑动以关闭 Ionic 2



我发现这个问题的公认答案真的很有帮助,但发现它也禁用了滑动关闭手势。

有没有办法让它只在打开菜单时禁用,而不是关闭它?尝试关闭它时,我发现它有点无响应,并认为滑动手势可以修复它。我在 Ionic 文档中找不到任何关于它的内容。

<ion-menu [content]="content" [swipeEnabled]="false">...</ion-menu>

在 Ionic 中没有默认的方法可以做到这一点,但您可以使用 ionOpenionClose 回调来处理何时应启用或禁用滑动功能:

  1. 打开菜单后启用滑动功能,因此可用于关闭菜单
  2. 关闭菜单后禁用滑动功能,因此无法用于打开菜单

工作扑克


视图

<ion-menu persistent="true" [content]="content" 
(ionOpen)="enableSwipe()"     <!-- Enable it when opening  -->
(ionClose)="disableSwipe()">  <!-- Disable it when closing -->
    <ion-header>
        <ion-toolbar color="primary">
            <ion-title>Side menu</ion-title>
        </ion-toolbar>
    </ion-header>    
    <ion-content>
    </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>

元件

import { Component, ViewEncapsulation } from '@angular/core';
import { MenuController } from 'ionic-angular';
import { HomePage } from '../pages/home/home';
@Component({
    templateUrl: 'app.html'
})
export class MyApp {
    public rootPage: any = HomePage;
    constructor(private menuCtrl: MenuController) {}
    ngAfterViewInit() {
      this.disableSwipe();
    }
    public enableSwipe(): void {
      this.menuCtrl.swipeEnable(true);
    }
    public disableSwipe(): void {
      this.menuCtrl.swipeEnable(false);
    }
  }

相关内容

  • 没有找到相关文章

最新更新