vue阻止事件冒泡等修飾符記錄

2021-09-28 17:29:03 字數 913 閱讀 4633

.stop   阻止單擊事件繼續傳播

.prevent 提交事件不再過載頁面

.capture 新增事件***時使用事件捕獲模式

.self 只當在 event.target 是當前元素自身時觸發處理函式

.once 只觸發一次

.passive vue 對應 addeventlistener 中的 passive 選項提供了 .passive 修飾符

這個 .passive 修飾符尤其能夠提公升移動端的效能。

不要把 .passive 和 .prevent 一起使用,因為 .prevent 將會被忽略,同時瀏覽器可能會向你展示乙個警告。請記住,.passive 會告訴瀏覽器你不想阻止事件的預設行為。

v-on:click.stop

="dothis"

>

a>

v-on:submit.prevent

="onsubmit"

>

form

>

v-on:click.stop.prevent

="dothat"

>

a>

v-on:submit.prevent

>

form

>

v-on:click.capture

="dothis"

>

...div

>

v-on:click.self

="dothat"

>

...div

>

v-on:scroll.passive

="onscroll"

>

...div

>

vue修飾符與事件修飾符

前言 在乙個控制項中使用修飾符 可以對控制項或操作做出一定的改變或者約束 修飾符作用 lazy v model在input事件秀實況中轉變為在change事件中同步 number 將使用者舒服的值轉換為number型別 trim 自動過濾使用者輸入的首尾空格 stop 阻止冒泡 prevent 阻止...

vue 事件修飾符

事件修飾符 在事件處理程式中呼叫event.preventdefault 或event.stoppropagation 是非常常見的需求。儘管我們可以在 methods 中輕鬆實現這點,但更好的方式是 methods 只有純粹的資料邏輯,而不是去處理 dom 事件細節。為了解決這個問題,vue.js...

Vue事件修飾符

也可以只設定事件名和修飾符而不傳入偵聽器,而且可以將修飾符串聯起來使用。例如,下面這個例子會阻止單擊事件沿dom樹向下傳遞,但只在第一次觸發時有效 除了上述事件修飾符,還有一些按鍵修飾符。它們用在鍵盤事件上,只有在特定按鍵按下時才會觸發事件。看下面這個例子 上面這個例子中,if語句中的的 只有當ke...