1. 程式人生 > >vue 遮罩層阻止預設滾動事件

vue 遮罩層阻止預設滾動事件

vue中提供 @touchmove.prevent 方法可以完美解決這個問題。 

<div class="child" @touchmove.prevent ></div>

vue同時還提供了其他的修飾符:

阻止單擊事件繼續傳播 :

<a v-on:click.stop="doThis"></a> 

提交事件不再過載頁面 : 

<form v-on:submit.prevent="onSubmit"></form> 

修飾符可以串聯  :  

<a v-on:click.stop.prevent="doThat"></a> 

只有修飾符  :

<form v-on:submit.prevent></form> 

新增事件監聽器時使用事件捕獲模式, 即元素自身觸發的事件先在此處理,然後才交由內部元素進行處理 :

<div v-on:click.capture="doThis">...</div> 

只當在 event.target 是當前元素自身時觸發處理函式 ,即事件不是從內部元素觸發的 :

<div v-on:click.self="doThat">...</div>