mpvue&ウィジェットでのイベント処理
イベントバインド
使い方は基本的に同じです.ただし、ウィジェットではbindtapにコンパイルされます
トラップバブル
： .wxml
<view
id="wrapper"
bind:tap="bind1"
capture-bind:tap="cbind1"
style="background:red;color:white;text-align:center;padding:10px;"
>
<view
id="inner"
bind:tap="bind2"
capture-bind:tap="cbind2"
>
view>
view>
// ： .js
Page({
bind1(e) {
console.log('wrapper ')
},
bind2(e) {
console.log('inner ')
},
cbind1(e) {
console.log('wrapper ')
},
cbind2(e) {
console.log('inner ')
}
})

イベントブロック
2つの方法:catshapを使用するか、イベント修飾子を使用する.stop
<p @click="bind1">
<button
@click="bind2" catchtap >
button>
p>
<p @click="bind1">
<button @click.stop="bind2" >
button>
p>
イベントオブジェクト
イベントインラインパラメータ
サポートされているイベントのタイプ
// event type web event
var eventTypeMap = {
tap: ['tap', 'click'],
touchstart: ['touchstart'],
touchmove: ['touchmove'],
touchcancel: ['touchcancel'],
touchend: ['touchend'],
longtap: ['longtap'],
input: ['input'],
blur: ['change', 'blur'],
submit: ['submit'],
focus: ['focus'],
scrolltoupper: ['scrolltoupper'],
scrolltolower: ['scrolltolower'],
scroll: ['scroll']
}; イベントエージェント
<button @click="bind"> button>
<button
bindtap="handleProxy"
data-eventid="{{'0'}}"
data-comkey="{{$k}}"
class="_button data-v-65f59a68"
>
button>
：https://www.imooc.com/read/45/article/807
イベント依頼はイベントエージェントとも呼ばれる:上記の例のイベントはp上で実行イベント`.