事件監(jiān)聽支持

事件處理器

幾乎全支持 Vue官方文檔:事件處理器

事件名稱 描述 是否包含 touches 數(shù)組
touchstart 觸摸開始薛训,多點觸控,后面的手指同樣會觸發(fā)
touchmove 接觸點改變茸炒,滑動時
touchend 觸摸結(jié)束值依,手指離開屏幕時
touchcancel 觸摸被取消哩簿,當(dāng)系統(tǒng)停止跟蹤觸摸的時候觸發(fā)
// 事件映射表鸟雏,左側(cè)為 WEB 事件室抽,右側(cè)為 ``uni-app`` 對應(yīng)事件
{
    click: 'tap',
    touchstart: 'touchstart',
    touchmove: 'touchmove',
    touchcancel: 'touchcancel',
    touchend: 'touchend',
    tap: 'tap',
    longtap: 'longtap',
    input: 'input',
    change: 'change',
    submit: 'submit',
    blur: 'blur',
    focus: 'focus',
    reset: 'reset',
    confirm: 'confirm',
    columnchange: 'columnchange',
    linechange: 'linechange',
    error: 'error',
    scrolltoupper: 'scrolltoupper',
    scrolltolower: 'scrolltolower',
    scroll: 'scroll'
}

每個觸摸事件都包括了三個觸摸列表妒穴,每個列表里包含了對應(yīng)的一系列觸摸點(用來實現(xiàn)多點觸控):
1)touches:當(dāng)前位于屏幕上的所有手指的列表宋税。
2)targetTouches:位于當(dāng)前DOM元素上手指的列表。
3)changedTouches:涉及當(dāng)前事件手指的列表讼油。

每個 Touch 對象包含的屬性如下:

clientX:觸摸目標(biāo)在視口中的x坐標(biāo)杰赛。
clientY:觸摸目標(biāo)在視口中的y坐標(biāo)。
identifier:標(biāo)識觸摸的唯一ID矮台。
pageX:觸摸目標(biāo)在頁面中的x坐標(biāo)乏屯。
pageY:觸摸目標(biāo)在頁面中的y坐標(biāo)。
screenX:觸摸目標(biāo)在屏幕中的x坐標(biāo)瘦赫。
screenY:觸摸目標(biāo)在屏幕中的y坐標(biāo)辰晕。
target:觸摸的DOM節(jié)點目標(biāo)。

踩坑注意:

  • 事件映射表中沒有的原生事件也可以使用确虱,例如map組件的regionchange 事件直接在組件上寫成 @regionchange,同時這個事件也非常特殊含友,它的 event typebeginend 兩個,導(dǎo)致我們無法在handleProxy 中區(qū)分到底是什么事件校辩,所以你在監(jiān)聽此類事件的時候同時監(jiān)聽事件名和事件類型既 <map @regionchange="functionName" @end="functionName" @begin="functionName"><map>

  • 平臺差異所致窘问,bindcatch 事件同時綁定時候,只會觸發(fā) bind ,catch 不會被觸發(fā)宜咒,要避免踩坑惠赫。

  • 事件修飾符

    • stop 的使用會阻止冒泡,但是同時綁定了一個非冒泡事件故黑,會導(dǎo)致該元素上的 catchEventName 失效儿咱!
    • prevent 可以直接干掉庭砍,因為uni-app里沒有什么默認(rèn)事件,比如 submit 并不會跳轉(zhuǎn)頁面
    • self 沒有可以判斷的標(biāo)識
    • once 也不能做概疆,因為uni-app沒有 removeEventListener, 雖然可以直接在 handleProxy 中處理逗威,但非常的不優(yōu)雅,違背了原意岔冀,暫不考慮
  • 按鍵修飾符:uni-app運行在手機端,沒有鍵盤事件概耻,所以不支持按鍵修飾符使套。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市鞠柄,隨后出現(xiàn)的幾起案子侦高,更是在濱河造成了極大的恐慌,老刑警劉巖厌杜,帶你破解...
    沈念sama閱讀 219,589評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件奉呛,死亡現(xiàn)場離奇詭異,居然都是意外死亡夯尽,警方通過查閱死者的電腦和手機瞧壮,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,615評論 3 396
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來匙握,“玉大人咆槽,你說我怎么就攤上這事∪Ψ模” “怎么了秦忿?”我有些...
    開封第一講書人閱讀 165,933評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長蛾娶。 經(jīng)常有香客問我灯谣,道長,這世上最難降的妖魔是什么蛔琅? 我笑而不...
    開封第一講書人閱讀 58,976評論 1 295
  • 正文 為了忘掉前任胎许,我火速辦了婚禮,結(jié)果婚禮上揍愁,老公的妹妹穿的比我還像新娘呐萨。我一直安慰自己,他們只是感情好莽囤,可當(dāng)我...
    茶點故事閱讀 67,999評論 6 393
  • 文/花漫 我一把揭開白布谬擦。 她就那樣靜靜地躺著,像睡著了一般朽缎。 火紅的嫁衣襯著肌膚如雪惨远。 梳的紋絲不亂的頭發(fā)上谜悟,一...
    開封第一講書人閱讀 51,775評論 1 307
  • 那天,我揣著相機與錄音北秽,去河邊找鬼葡幸。 笑死,一個胖子當(dāng)著我的面吹牛贺氓,可吹牛的內(nèi)容都是我干的蔚叨。 我是一名探鬼主播,決...
    沈念sama閱讀 40,474評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼辙培,長吁一口氣:“原來是場噩夢啊……” “哼蔑水!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起扬蕊,我...
    開封第一講書人閱讀 39,359評論 0 276
  • 序言:老撾萬榮一對情侶失蹤搀别,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后尾抑,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體歇父,經(jīng)...
    沈念sama閱讀 45,854評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,007評論 3 338
  • 正文 我和宋清朗相戀三年再愈,在試婚紗的時候發(fā)現(xiàn)自己被綠了榜苫。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,146評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡践磅,死狀恐怖单刁,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情府适,我是刑警寧澤羔飞,帶...
    沈念sama閱讀 35,826評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站檐春,受9級特大地震影響逻淌,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜疟暖,卻給世界環(huán)境...
    茶點故事閱讀 41,484評論 3 331
  • 文/蒙蒙 一卡儒、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧俐巴,春花似錦骨望、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,029評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至缘圈,卻和暖如春劣光,著一層夾襖步出監(jiān)牢的瞬間袜蚕,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,153評論 1 272
  • 我被黑心中介騙來泰國打工绢涡, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留牲剃,地道東北人。 一個月前我還...
    沈念sama閱讀 48,420評論 3 373
  • 正文 我出身青樓雄可,卻偏偏與公主長得像凿傅,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子滞项,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,107評論 2 356

推薦閱讀更多精彩內(nèi)容

  • 這篇筆記主要包含 Vue 2 不同于 Vue 1 或者特有的內(nèi)容狭归,還有我對于 Vue 1.0 印象不深的內(nèi)容。關(guān)于...
    云之外閱讀 5,050評論 0 29
  • VUE Vue :數(shù)據(jù)驅(qū)動的M V Vm框架 m :model(后臺提供數(shù)據(jù))文判,v :view(頁面),vM(模板...
    wudongyu閱讀 5,406評論 0 11
  • 1.安裝 可以簡單地在頁面引入Vue.js作為獨立版本室梅,Vue即被注冊為全局變量戏仓,可以在頁面使用了。 如果希望搭建...
    Awey閱讀 11,032評論 4 129
  • vue概述 在官方文檔中亡鼠,有一句話對Vue的定位說的很明確:Vue.js 的核心是一個允許采用簡潔的模板語法來聲明...
    li4065閱讀 7,229評論 0 25
  • 不是不寫了赏殃,是手機清零還原后不記得安裝,想到了有給自己等一等的信號间涵,結(jié)果落下了仁热。 這周回歸的還有我的讀經(jīng)《地藏菩薩...
    地頭力_永華閱讀 135評論 0 1