ionic4-手势使用

在ionic4项目中需要用到长按事件,于是直接去官网查询了下ionic4的api,但是很可惜没查到,貌似ionic4默认不支持手势识别,于是只能Google下(百度没搜到),好在Google还是很给力的,一下子就查到了相关的用法,在这里做个记录。

ionic4中的gestures 手势事件如下：

tap       // 点击事件
press   // 长按事件
pan      // 滑动的时候触发的事件,滑动触发多次
swipe   // 滑动事件 滑动触发一次
rotate   // 旋转事件
pinch   // 捏合(pinch)手势

使用步骤如下:
1.安装hammerjs依赖

npm install hammerjs --save

2.在ionic项目中引入hammerjs。在main.ts中,增加如下代码:

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

// 引入hammerjs
import 'hammerjs';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

3.使用手势。完成上面步骤,我们就可以愉快的使用手势识别了

      长按触发事件



     点击触发事件

PS:注意下,一定要安装hammerjs依赖,否则在使用时会不生效且出现如下提示:

The "press" event cannot be bound because Hammer.JS is not loaded and no custom loader has been specified.