1. 程式人生 > 實用技巧 >vue中 修飾符

vue中 修飾符

.stop 阻止事件繼續傳播
.prevent 阻止標籤預設行為
.capture 使用事件捕獲模式,即元素自身觸發的事件先在此處處理,然後才交由內部元素進行處理
.self 只當在 event.target 是當前元素自身時觸發處理函式
.once 事件將只會觸發一次
.passive 告訴瀏覽器你不想阻止事件的預設行為

使用修飾符時,順序很重要;相應的程式碼會以同樣的順序產生。因此,用v-on:click.prevent.self會阻止所有的點選,而v-on:click.self.prevent只會阻止對元素自身的點選。

二、 v-model的修飾符


<1> .lazy
預設情況下,v-model同步輸入框的值和資料。可以通過這個修飾符,轉變為在change事件再同步。

<2> .number
自動將使用者的輸入值轉化為數值型別

<3> .trim
自動過濾使用者輸入的首尾空格

三、鍵盤事件的修飾符


在我們的專案經常需要監聽一些鍵盤事件來觸發程式的執行,而Vue中允許在監聽的時候新增關鍵修飾符:

對於一些常用鍵,還提供了按鍵別名:

全部的按鍵別名:

.enter
.tab
.delete (捕獲“刪除”和“退格”鍵)
.esc
.space
.up
.down
.left
.right
修飾鍵:

.ctrl
.alt
.shift
.meta