小編給大家分享一下Vue.js方法與事件指的是什么意思，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
方法與事件
@click調用得方法名后可以不跟括號()，如果該方法有參數，默認會將原生事件對象event傳入。
這種在HTML元素上監聽事件的設計看似將DOM與JavaScript緊耦合，違背分離的原理，實則剛好相反。因為通過HTML就可以知道調用的是哪個方法，將邏輯與DOM解耦，便于維護。
最重要的是，當viewModel銷毀時，所有的事件處理器都會自動銷毀，無需自己處理。
Vue提供了一個特殊變量$event，用于訪問原生DOM事件。
<div id="app">
<a href="https://www.apple.com/" @click="handleClick('禁止打開',$event)">打開鏈接</a>
</div>修飾符
Vue支持以下修飾符：
.stop
.prevent
.capture
.self.once
具體用法如下：
| 修飾符功能 | 使用示例 |
|---|---|
| 阻止單擊事件冒泡 | <a @click.stop="handle"></a> |
| 提交事件不再重載頁面 | <form @submit.prevent="handle"></form> |
| 修飾符可以串聯 | <a @click.stop.prevent="handle"></a> |
| 只有修飾符 | <form @submit.prevent></form> |
| 添加事件偵聽器時使用事件捕獲模式 | <p @click.capture="handle">...</p> |
| 只當事件在該元素本身（不是子元素）觸發時執行回調 | <p @click.self="handle">...</p> |
| 只觸發一次，組件同樣適用 | <p @click.once="handle">...</p> |
在表單元素上監聽鍵盤事件時，還可以使用按鍵修飾符。
| 修飾符功能 | 使用示例 |
|---|---|
只有在keyCode是13時調用vm.submit() | <input @keyup.13="submit"> |
除了具體的某個keyCode外，Vue還提供了一些快捷名稱：
.enter
.tab
.delete（補貨“刪除”和“退格”鍵）
.esc
.space
.up
.down
.left
.right
這些按鍵修飾符也可以組合使用，或和鼠標一起配合使用：
.ctrl
.alt
.shift
.meta
以上是“Vue.js方法與事件指的是什么意思”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
