事件修飾符

2022-03-26 10:28:06 字數 883 閱讀 7986

修飾符是由點開頭的指令字尾來表示的：

事件修飾符:

方法中最好只有純粹的的資料邏輯，而不是處理dom事件細節。這時候就會用到事件修飾符

<


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>


<


div 


v-on:click.self


="dothat"


>...


div>
注意：使用修飾符時，順序很重要；相應的**會以同樣的順序產生。因此，用v-on:click.prevent.self會阻止所有的點選，而v-on:click.self.prevent只會阻止對元素自身的點選。

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...