在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.使用手势。完成上面步骤,我们就可以愉快的使用手势识别了
<ion-button (press)="onPress($event)">
长按触发事件
</ion-button>
<ion-button (tap)="onTap($event)">
点击触发事件
</ion-button>
PS:注意下,一定要安装hammerjs依赖,否则在使用时会不生效且出现如下提示:
The "press" event cannot be bound because Hammer.JS is not loaded and no custom loader has been specified.
