tft每日頭條

 > 圖文

 > 微信小程序什麼是事件處理函數

微信小程序什麼是事件處理函數

圖文 更新时间:2025-02-13 01:02:10

先來理解一下什麼叫事件。

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)1

視圖層,字面理解即可,即小程序界面視圖層

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)2

它的程序在.wxml文件中,事件是視圖層到邏輯層的通訊方式,可以理解為.wxml文件到 .js文件這一層的通訊方式。

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)3

事件可以将用戶的行為(.wxml中的bindtap點擊行為)反饋到邏輯層處理(.js中對應的處理函數),事件可以綁定在組件上,當達到觸發事件,就會執行邏輯層中對應的事件處理函數。

而事件對象攜帶的額外信息可以在開發者工具的console中了解:

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)4

當然不同類型的事件(type:”tap”和type:”touch”)所攜帶的對象也不盡相同,這一點在上幾篇文章《由console.log()窺探事件處理函數的參數》中已經有介紹。

事件分為冒泡事件和非冒泡事件:

1. 冒泡事件:當一個組件上的事件被觸發後,該事件會向父節點傳遞。

2. 非冒泡事件:當一個組件上的事件被觸發後,該事件不會向父節點傳遞。

bind事件綁定不會阻止冒泡事件向上冒泡,catch事件綁定可以阻止冒泡事件向上冒泡。

注意catch事件綁定可以阻止冒泡事件向上冒泡。這是關鍵,現在上代碼:

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)5

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)6

其中中間那父節點是catch事件綁定,當點擊son view按鍵時

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)7

console:

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)8

子節點向父節點冒泡時,在父節點遇到catch事件綁定,阻止事件冒泡,所以冒泡停留在父節點這一層,輸出 son father;當中間的父節點這層換成bind事件綁定後,son view按鍵不再阻止冒泡,事件一直到最上級父節點,也就時爺爺層才停止。

微信小程序什麼是事件處理函數(微信小程序事件綁定及冒泡的理解)9

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关圖文资讯推荐

热门圖文资讯推荐

网友关注

Copyright 2023-2025 - www.tftnews.com All Rights Reserved