# 事件

事件管理器從屬于元素，提供給組件的設(shè)計(jì)者一個(gè)向使用者派發(fā)事件的手段。

事件有兩種使用方式，一種是走傳統(tǒng)的腳本邏輯，一種是用小程序在wxml中的事件綁定。

# 腳本邏輯

在腳本中使用事件很簡單，用一段代碼例子來解釋：

// 定義監(jiān)聽器，比如這個(gè)事件的參數(shù)類型是`number`
function handleTest(params: number, sender: XrFrame.Element) {
  console.log('test', params, sender);
}

// 添加事件監(jiān)聽器
el.event.add('test', handleTest);

// 移除事件監(jiān)聽器
el.event.remove('test', handleTest);

// 添加事件監(jiān)聽器，但會(huì)在一次觸發(fā)后自動(dòng)移除
el.event.addOnce('test', handleTest);

# wxml綁定

在wxml中進(jìn)行事件綁定會(huì)稍微復(fù)雜一些，還是來看個(gè)例子：

<xr-scene bind:tick="handleTick">
</xr-scene>

這里我們給xr-scene標(biāo)簽綁定了tick事件，事件的handler被定義在組件的method內(nèi)，和其他的小程序組件一致。

這里要注意的是如此綁定的事件獲取事件參數(shù)的方法不同：

handleTick: function(event) {
  const {value, el} = event.detail;
}

這里取出的value就是事件的參數(shù)，el則是派發(fā)事件的那個(gè)元素。

# 派發(fā)事件

知道了如何監(jiān)聽事件，我們還需要知道如何派發(fā)，依照以上兩種監(jiān)聽方式，事件的觸發(fā)有不同參數(shù)：

el.event.trigger(type, event, immediately, toXML, bubbles);

immediately是指是否要立即觸發(fā)，默認(rèn)是true，如果為false，則會(huì)對(duì)當(dāng)幀同名的事件進(jìn)行合并，然后在當(dāng)幀組件生命周期的驅(qū)動(dòng)前派發(fā)。

toXML是說這個(gè)事件是否要派發(fā)到xml上，來允許開發(fā)者使用事件綁定，默認(rèn)是true。

bubbles是指事件是否要沿著xr-frame的節(jié)點(diǎn)樹冒泡，同時(shí)也會(huì)影響在xml中的冒泡。

注意在Shadow元素的子孫元素中，如果要讓事件能夠在xml中被綁定，bubbles必須為true。