微信小程式 bindtap等事件傳參

2022-08-25 09:42:09 字數 925 閱讀 2452

什麼是事件

事件是檢視層到邏輯層的通訊方式。 事件可以將使用者的行為反饋到邏輯層進行處理。

事件可以繫結在元件上,當達到觸發事件,就會執行邏輯層中對應的事件處理函式。

事件物件可以攜帶額外資訊,如 id, dataset, touches。

看圖,因為需要傳遞的資料比較多,所以我們通過dataset攜帶引數資訊。如果只有乙個引數,可以通過id來傳遞。

詳解(以常見的tap點選事情為例)

wxml:

click me! view>

js:page( })

event 列印結果

},"currenttarget":

},///////////////////////////////

"detail": ,

"touches":,

"changedtouches":

}注意兩點:

1、data-名稱 不能有大寫字母,如果需要,可以通過 - (中劃線)來連線單詞,編譯的時候小程式會將第二個單詞首字母自動大寫。圖中**是為了自己標誌,所以第二個單詞的首字母大寫了,其實可以不用。data-* 屬性中不可以存放物件。

2、注意列印結果中target和currenttarget的區別。

target 觸發事件的源元件。

currenttarget 事件繫結的當前元件。

如果你在父容器上繫結了事件並傳參,當你點選父容器時,事件繫結的元件和觸發事件的源元件是同乙個元素,所以currenttarget 、target 都可以拿到引數,但是當你點選子元素時,target 就不是事件繫結的元件了,所以拿不到引數。

由於事件冒泡的機制,父容器上繫結的事件依然可以觸發,所以currenttarget 依然可以拿到引數。

說明id傳參和dataset類似,只是最後獲取值的時候不同。event.currenttarget.id

微信小程式bindtap事件

bindtap就是點選事件 在wxml檔案下 primary bindtap btnclick 在js檔案下 page 生命週期函式 監聽頁面載入 onload function options 生命週期函式 監聽頁面初次渲染完成 onready function 生命週期函式 監聽頁面顯示 ons...

微信小程式 bindtap等事件傳參

事件是檢視層到邏輯層的通訊方式。事件可以將使用者的行為反饋到邏輯層進行處理。事件可以繫結在元件上,當達到觸發事件,就會執行邏輯層中對應的事件處理函式。事件物件可以攜帶額外資訊,如 id,dataset,touches。wxml taptest data hi wechat bindtap tapna...

微信小程式 bindtap獲取不到引數

bindtap的基礎用法是 click me page 控制太輸出 currenttarget detail touches changedtouches 所以到取到data hi中的資料應該是 var hi event.target.dataset.hi 這裡要注意的是data 中的 需要小寫,否...