在移动设备上从上到下滑动不起作用（锤子 js）答案

【问题标题】：Swiping from top to bottom on mobile doesn't work (hammer js)在移动设备上从上到下滑动不起作用（锤子 js）
【发布时间】：2020-05-13 08:28:47
【问题描述】：

我在我的 Angular 应用程序中使用了hammerjs。我在主页上有图像轮播，我可以左右滑动。我也有一个固定的标题，当我点击我的汉堡按钮时，菜单被打开，我想从下到上滑动它。所以现在我不能在我的主页上从上到下滑动。在轮播作品上滑动，也在标题上滑动。我试图在我的主页上评论我的轮播组件，当我在顶部滑动时，滑动效果很好。我该如何解决？

export class HammerConfig extends HammerGestureConfig {
    public overrides: Record<string, {}> = {
        pinch: { enable: false },
        rotate: { enable: false },
        swipe: { direction: Hammer.DIRECTION_ALL },
    };
}

【问题讨论】：

标签： angular hammer.js

【解决方案1】：

export class MyHammerConfig extends HammerGestureConfig {
  events: string[] = [];

  overrides: {[key: string]: Object} = {};

  buildHammer(element: HTMLElement): HammerInstance {
    return new Hammer(element, {
      cssProps: Hammer.defaults.cssProps,
      recognizers: [
        [Hammer.Swipe],
        [Hammer.Tap],
      ],
    });
  }
}

在 MyComponent.ts 中

const hammerConfig = new HtcHammerConfig()
    const hammer = hammerConfig.buildHammer(document.documentElement)

    fromEvent(hammer, "swipe").pipe(
      takeWhile(()=>this.alive))
      .subscribe((res: any) => {

        console.log(res.deltaY<0?'to the top':'to the bottom'  )
      });

【讨论】：