91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

微信小程序怎么解綁事件

發布時間:2022-03-09 09:48:08 來源:億速云 閱讀:242 作者:iii 欄目:開發技術

這篇“微信小程序怎么解綁事件”文章的知識點大部分人都不太理解,所以小編給大家總結了以下內容,內容詳細,步驟清晰,具有一定的借鑒價值,希望大家閱讀完這篇文章能有所收獲,下面我們一起來看看這篇“微信小程序怎么解綁事件”文章吧。

什么是事件


  • 事件是視圖層到邏輯層的通訊方式。

  • 事件可以將用戶的行為反饋到邏輯層進行處理。

  • 事件可以綁定在組件上,當達到觸發事件,就會執行邏輯層中對應的事件處理函數。

  • 事件對象可以攜帶額外信息,如id, dataset, touches。


事件的使用方式


  • 在組件中綁定一個事件處理函數。

bindtap,當用戶點擊該組件的時候會在該頁面對應的Page中找到相應的事件處理函數。

<view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view>
  • 在相應的Page定義中寫上相應的事件處理函數,參數是event。

Page({
  tapName: function(event) {console.log(event)
  }
})
  • 可以看到log出來的信息大致如下

    {"type": "tap","timeStamp":895,"target": {  "id": "tapTest",  "dataset": {   "hi": "WeChat"
      }
    },"currentTarget": {  "id": "tapTest",  "dataset": {"hi": "WeChat"
      }
    },"detail": {  "x":53,  "y":14},"touches": [{  "identifier":0,
      "pageX":53,  "pageY":14,  "clientX":53,  "clientY":14,
    }],"changedTouches": [{  "identifier":0,  "pageX":53,  "pageY":14,  "clientX":53,  "clientY":14,}],}

事件詳解

事件分類

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

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

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

WXML的冒泡事件列表:

類型 觸發條件
touchstart 手指觸摸動作開始
touchmove 手指觸摸后移動
touchcancel 手指觸摸動作被打斷,如來電提醒,彈窗
touchend 手指觸摸動作結束
tap 手指觸摸后馬上離開
longtap 手指觸摸后,超過350ms再離開

注:除上表之外的其他組件自定義事件都是非冒泡事件,如<form/>submit事件,<input/>input事件,<scroll-view/>scroll事件,(詳見各個組件)

事件綁定


事件綁定的寫法同組件的屬性,以key、value的形式。

  • key以bindcatch開頭,然后跟上事件的類型,如bindtap, catchtouchstart

  • value是一個字符串,需要在對應的Page中定義同名的函數。不然當觸發事件的時候會報錯。

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

如在下邊這個例子中,點擊inner view會先后觸發handleTap3handleTap2(因為tap事件會冒泡到middle view,而middle view阻止了tap事件冒泡,不再向父節點傳遞),點擊middle view會觸發handleTap2,點擊outter view會觸發handleTap1

<view id="outter" bindtap="handleTap1">
  outer view  <view id="middle" catchtap="handleTap2">middle view<view id="inner" bindtap="handleTap3">  inner view</view>
  </view></view>

事件對象


如無特殊說明,當組件觸發事件時,邏輯層綁定該事件的處理函數會收到一個事件對象。

BaseEvent基礎事件對象屬性列表:

屬性 類型 說明
type String 事件類型
timeStamp Integer 事件生成時的時間戳
target Object 觸發事件的組件的一些屬性值集合
currentTarget Object 當前組件的一些屬性值集合

CustomEvent 自定義事件對象屬性列表(繼承 BaseEvent):

屬性 類型 說明
detail Object 額外的信息

TouchEvent 觸摸事件對象屬性列表(繼承 BaseEvent):

屬性 類型 說明
touches Array 觸摸事件,當前停留在屏幕中的觸摸點信息的數組
changedTouches Array 觸摸事件,當前變化的觸摸點信息的數組

特殊事件:<canvas/>中的觸摸事件不可冒泡,所以沒有 currentTarget。

type

通用事件類型

timeStamp

該頁面打開到觸發事件所經過的毫秒數。

target

觸發事件的源組件。

屬性 類型 說明
id String 事件源組件的id
tagName String 當前組件的類型
dataset Object 事件源組件上由data-開頭的自定義屬性組成的集合

currentTarget

事件綁定的當前組件。

屬性 類型 說明
id String 當前組件的id
tagName String 當前組件的類型
dataset Object 當前組件上由data-開頭的自定義屬性組成的集合

說明: target 和 currentTarget 可以參考上例中,點擊 inner view 時,handleTap3 收到的事件對象 target 和 currentTarget 都是 inner,而 handleTap2 收到的事件對象 target 就是 inner,currentTarget 就是 middle。

 

dataset

在組件中可以定義數據,這些數據將會通過事件傳遞給 SERVICE。書寫方式:以data-開頭,多個單詞由連字符-鏈接,不能有大寫(大寫會自動轉成小寫)如data-element-type,最終在 event.target.dataset 中會將連字符轉成駝峰elementType

示例:

<view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap"> DataSet Test </view>
Page({  bindViewTap:function(event){
    event.target.dataset.alphaBeta === 1 // - 會轉為駝峰寫法event.target.dataset.alphabeta === 2 // 大寫會轉為小寫
  }
})

touches

touches 是一個數組,每個元素為一個 Touch 對象(canvas 觸摸事件中攜帶的 touches 是 CanvasTouch 數組)。 表示當前停留在屏幕上的觸摸點。

Touch 對象
屬性 類型 說明
identifier Number 觸摸點的標識符
pageX, pageY Number 距離文檔左上角的距離,文檔的左上角為原點 ,橫向為X軸,縱向為Y軸
clientX, clientY Number 距離頁面可顯示區域(屏幕除去導航條)左上角距離,橫向為X軸,縱向為Y軸
CanvasTouch 對象
屬性 類型 說明 特殊說明
identifier Number 觸摸點的標識符  
x, y Number 距離 Canvas 左上角的距離,Canvas 的左上角為原點 ,橫向為X軸,縱向為Y軸  

changedTouches

changedTouches 數據格式同 touches。表示有變化的觸摸點,如從無變有(touchstart),位置變化(touchmove),從有變無(touchend、touchcancel)。

detail

自定義事件所攜帶的數據,如表單組件的提交事件會攜帶用戶的輸入,媒體的錯誤事件會攜帶錯誤信息,詳見組件定義中各個事件的定義。

點擊事件的detail 帶有的 x, y 同 pageX, pageY 代表距離文檔左上角的距離。

以上就是關于“微信小程序怎么解綁事件”這篇文章的內容,相信大家都有了一定的了解,希望小編分享的內容對大家有幫助,若想了解更多相關的知識內容,請關注億速云行業資訊頻道。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

东方市| 顺平县| 青岛市| 广昌县| 玉溪市| 察雅县| 渝北区| 中山市| 宾阳县| 岳西县| 玛曲县| 开平市| 林西县| 琼海市| 温州市| 安康市| 宁国市| 清镇市| 盘锦市| 延津县| 剑阁县| 邯郸市| 福安市| 枝江市| 花垣县| 精河县| 罗城| 固阳县| 临沭县| 武汉市| 梧州市| 岗巴县| 万宁市| 大丰市| 左云县| 河津市| 洛扎县| 青阳县| 柳河县| 大理市| 乐清市|