vue——修飾符
阿新 • • 發佈：2021-10-04
事件修飾符
在事件處理函式中呼叫event.preventDefault()或event.stopPropageation(）是非常常見的需求。因此vue提供了事件修飾符的概念，來輔助程式設計師更方便的對事件的觸發進行控制。例如：@click.prevent = "方法"
常用的2個事件修飾符如下：
| 事件修飾符 | 說明 |
| .prevent | 阻止預設行為（例如：阻止a連結的跳轉，阻止表單的提交等） |
| .stop | 阻止事件冒泡 |
按鍵修飾符
@keyup.esc = "方法"
| 按鍵修飾符 | 說明 |
| .esc | 按下鍵盤上的esc鍵時呼叫繫結的方法 |
| .enter | 按下鍵盤上的enter鍵時呼叫繫結的方法 |
v-model的修飾符
為了方便對使用者輸入的內容進行處理，vue為v-model指令提供了3個修飾符，分別是：
| 修飾符 | 作用 | 示例 |
| .number | 自動將使用者的輸入值轉為數值型別 | <input v-model.number="age" /> |
| .trim | 自動過濾使用者輸入的首尾空白字元 | <input v-model.trim="msg" /> |
| .lazy | 在"change"時而非"input"時更新 | <input v-model.lazy="msg" /> |