欧美综合影院在线影院,国产精品女人久久久久久,日韩精品无码去免费专区,樱花草在线社区WWW日本影院

作者：瘋狂的貓

》》》什么是事件

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

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

• 事件可以綁定在組件上，當(dāng)達(dá)到觸發(fā)事件，就會(huì)執(zhí)行邏輯層中對(duì)應(yīng)的事件處理函數(shù)。

• 事件對(duì)象可以攜帶額外信息，如id, dataset, touches。

》》》事件分類(lèi)

• touchstart 手指觸摸

• touchmove 手指觸摸后移動(dòng)

• touchcancel 手指觸摸動(dòng)作被打斷，如彈窗和來(lái)電提醒

• touchend 手指觸摸動(dòng)作結(jié)束

• tap 手指觸摸后離開(kāi)

• longtap 手指觸摸后后，超過(guò)350ms離開(kāi)

》》》事件綁定

事件綁定的寫(xiě)法同組件的屬性，以 key、value 的形式。

• key 以bind或catch開(kāi)頭，然后跟上事件的類(lèi)型，如bindtap, catchtouchstart

• value 是一個(gè)字符串，需要在對(duì)應(yīng)的 Page 中定義同名的函數(shù)。不然當(dāng)觸發(fā)事件的時(shí)候會(huì)報(bào)錯(cuò)。 bind事件綁定不會(huì)阻止冒泡事件向上冒泡，catch事件綁定可以阻止冒泡事件向上冒泡。

上面簡(jiǎn)單介紹了小程序事件基礎(chǔ)，是時(shí)候彰顯"事件"的威力：

• 單擊(tap)

• 雙擊(dbtap)

• 長(zhǎng)按(longtap)

• 滑動(dòng)

• 多點(diǎn)觸控

1.單擊

單擊事件由touchstart、touchend組成,touchend后觸發(fā)tap事件。

<view>
  <button type="primary" bindtouchstart="mytouchstart" bindtouchend="mytouchend" bindtap="mytap">點(diǎn)我吧</button>
</view>

mytouchstart: function(e){
    console.log(e.timeStamp + '- touch start')
},mytouchend: function(e){    
    console.log(e.timeStamp + '- touch end')
},mytap: function(e){    
    console.log(e.timeStamp + '- tap')
}
 

2.雙擊

雙擊事件由兩個(gè)單擊事件組成，兩次間隔時(shí)間小于300ms認(rèn)為是雙擊；微信官方文檔沒(méi)有雙擊事件，需要開(kāi)發(fā)者自己定義處理。

<view>
  <button type="primary" bindtap="mytap">點(diǎn)我吧</button>
</view>

3.長(zhǎng)按

長(zhǎng)按事件手指觸摸后，超過(guò)350ms再離開(kāi)。

<view>
  <button type="primary" bindtouchstart="mytouchstart" bindlongtap="mylongtap" 
    bindtouchend="mytouchend" bindtap="mytap">點(diǎn)我吧</button>
</view>

mytouchstart: function(e){    
    console.log(e.timeStamp + '- touch start')
},//長(zhǎng)按事件mylongtap: function(e){    
    console.log(e.timeStamp + '- long tap')
},mytouchend: function(e){    
    console.log(e.timeStamp + '- touch end')
},mytap: function(e){    
    console.log(e.timeStamp + '- tap')
}

單擊、雙擊、長(zhǎng)按屬于點(diǎn)觸事件，會(huì)觸發(fā)touchstart、touchend、tap事件，touchcancel事件只能在真機(jī)模擬，不多說(shuō)了。