小程序事件處理

事件小程序

事件就是用戶到界面(視圖)的交互行爲,移動端常見的交互行爲(觸屏,觸摸移動,長按,鍵盤,多點觸控,搖一搖,各類狀態事件,...,重按)

事件綁定動畫

在小程序中綁定事件使用bind(不會阻止冒泡),catch capture-bind使用捕獲、capture-catch關鍵字,後者將中斷捕獲階段和取消冒泡階段 //bind事件綁定不會阻止冒泡事件向上冒泡,catch事件綁定能夠阻止冒泡事件向上冒泡。 兩種寫法 bind:tap bindtap catch:tap catchtap 例如:<view bindTap='{{clickFn}}'></view> **在page.js中** Page({ clickFn(event){ console.log(event) } })

事件分類ui

事件分爲冒泡事件和非冒泡事件
    1.冒泡事件:當一個組件上的事件被觸發後,該事件會向父節點傳遞。(點擊、移動、觸摸打斷touchcancel,tap輕按,longpress長按,longtap長按,transitionstart,animationiteration迭代結束,動畫監聽) 2.非冒泡事件:當一個組件上的事件被觸發後,該事件不會向父節點傳遞。(例如:表單相關事件、加載相關事件)

交互事件spa

觸摸  touchstart
移動  touchmove
打斷  touchcancel
離開  touchend
輕觸  tap
長按(超過350ms)  longtap  longpress
重按(3D Touch 設備) touchforcechange

**監聽事件**
transitionend	會在 WXSS transition 或 wx.createAnimation 動畫結束後觸發 animationstart 會在一個 WXSS animation 動畫開始時觸發 animationiteration 會在一個 WXSS animation 一次迭代結束時觸發 animationend 會在一個 WXSS animation 動畫完成時觸發 touchforcechange 在支持 3D Touch 的 iPhone 設備,重按時會觸發

Event對象code

{
 type:事件類型,  timeStamp:時間戳,  target:觸發事件的組件的屬性值的集合{  id:事件源組件id,  tagName:當前組件的類型,  dataset:事件源組件上由data-開頭的自定義屬性組成的集合 },  currentTarget:當前組件的一些屬性值集合,  detail:額外信息{x,y}觸摸點的位置,  touches:手指列表,  changedTouches:移動了的手指信息 }
相關文章
相關標籤/搜索