这里写目录标题
bind与catch的区别
bind和catch:
bind事件绑定不会阻止冒泡事件往上冒泡,简单来说,bind所绑定的事件对应会向上传递,让自己的父组件响应对应的事件。而catch事件会把对应的事件阻拦在自己这里,只有自己能够响应对应事件。、
----------------
点击事件(单击):bindtap
双击事件
要想实现双击事件,只能通过我们写代码判断用户点击是否是双击行为。
思想:记录下用户两次点击的时间戳,两个时间戳相减如果小于300毫秒,则判断是双击事件。
.wxml代码:
<button data-time="{{lastTapTime}}" data-title="双击" bindtap="doubleClick">双击事件</button>
.js代码:
data: {
lastTapTime:0,
},
doubleClick: function (e) {
var curTime = e.timeStamp
var lastTime = e.currentTarget.dataset.time
// 通过e.currentTarget.dataset.time 访问到绑定到button组件的自定义数据
console.log("上一次点击时间:"+lastTime)
console.log("这一次点击时间:" + curTime)
console.log('--------------------------------');
if (curTime - lastTime > 0) {
if (curTime - lastTime < 300) {//判断为双击事件
console.log("您双击了,用了:" + (curTime - lastTime))
}
}
this.setData({
lastTapTime: curTime
})
},
长按事件:bindlongpress、bindlongtap
长按事件是指 触摸超过350ms再离开
以前的(旧版)长按事件 bindlongtap 执行完后会触发点击事件 bindtap
现在的(新版)长按事件 bindlongpress 执行完后并不会触发点击事件 bindtap
长按与点击事件的执行顺序与关系
事件 | 触发顺序 |
---|---|
点击事件 | bindtouchstart --> bindtouchend --> tap |
旧版长按事件 | bindtouchstart --> bindlongtap --> bindtouchend --> tap |
新版长按事件 | bindtouchstart --> bindlongpress --> bindtouchend |
*[旧版长按事件]:bindlongtap | |
*[新版长按事件]:bindlongpress |
----------------
键盘输入事件:bindinput
键盘输入时触发,event.detail = {value, cursor, keyCode},keyCode 为键值,2.1.0
起支持,处理函数可以直接 return 一个字符串,将替换输入框的内容。
回车事件:bindconfirm
输入框聚焦:bindfocus
输入框失焦:bindblur
value改变事件:bindchange
---------------------
触摸事件:
触摸动作开始:bindtouchstart
触摸动作结束:bindtouchend
触摸过程移动:bindtouchmove
触摸动作被打断:bindtouchcancel
如来电提醒,弹窗