微信小程序 事件

事件绑定

事件绑定的写法同组件的属性，以 key、value 的形式。

1. key 以bind或catch开头，然后跟上事件的类型，如bindtap, catchtouchstart
2. value 是一个字符串，需要在对应的 Page 中定义同名的函数。不然当触发事件的时候会报错。 bind事件绑定不会阻止冒泡事件向上冒泡，catch事件绑定可以阻止冒泡事件向上冒泡。

事件分类

1. touchstart 手指触摸
2. touchmove 手指触摸后移动
3. touchcancel 手指触摸动作被打断，如弹窗和来电提醒
4. touchend 手指触摸动作结束
5. tap 手指触摸后离开
6. longtap 手指触摸后后，超过350ms离开

单击事件

由touchstart、touchend组成,touchend后触发tap事件。

//wxml

<button bindtouchstart="clickStart" bindtouchend="clickEnd" bindtap="clickTap">单击</button>

双击事件

由两个单击事件组成，两次间隔时间小于300ms认为是双击；微信官方文档没有双击事件，需要开发者自己定义处理。

//wxml

<button data-time="{{lastTapTime}}" data-title="标题" bindtap="doubleClick">双击</button>

//js

Page({
  data: {
    lastTapTime: 0
  },
  doubleClick: function (e) {
    var curTime = e.timeStamp
    var lastTime = e.currentTarget.dataset.time
    //var lastTime = this.data.lastTapTime
    console.log(lastTime)
    if (curTime - lastTime > 0) {
      if (curTime - lastTime < 300) {
        console.log("挺快的双击，用了：" + (curTime - lastTime))
      }
    }
    this.setData({
      lastTapTime: curTime
    })
  }
})

长按

<button type="primary" bindtouchstart="startClick" bindtouchend="endClick" bindlongtap="longClick" bindtap="holdClick">点住别撒手</button>

//移动