ionic4禁用手势操作/滑动返回

201

在ionic3中,可以通过NavController.swipeBackEnabled禁用手势返回操作,但ionic4中没有这个api。

4的文档没有搜索功能,也没找到对应的api接口,自己研究出两种方法:

方法1:

自己把组件写成stencil组件。

通过看ionic4源码得知,ionic4提供了单独的gesture接口:

constructor( private gesture: Gesture ) { }
this.gesture.setDisabled(true);

但这个方法通过angular调用会报错,只能供stencil组件调用,非常坑

 

方法2:

另一个方法是通过swipeGesture指令,但只有ion-router-outlet等少数ionic组件有。

<ion-router-outlet [swipeGesture]="swipeEnable"></ion-router-outlet>

而且ion-router-outlet通常是在app.component.html中,也就是说,你得在app.component.html中写个订阅,其他组件中才能操作它;或者在app.component.ts中监听页面,确定哪些页面不允许手势回退。

代码如下:

  swipeEnable = true;
  watchSwipeEnable() {
    this.events.subscribe("swipeEnable", (enable: boolean) => {
      setTimeout(() => {
        this.swipeEnable = enable;
      });
    })
  }

这样会触发ExpressionChangedAfterItHasBeenCheckedError报错,必须用异步方法调用。总之这样的做法不完美,但能用。

 

暂时没找到其他方法

留下一个答复

Please enter your comment!
Please enter your name here