Vue.js方法與事件的介紹

這篇文章帶給大家的內容是關於Vue.js方法與事件的介紹，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

方法與事件

@click呼叫得方法名稱後可以不跟括號()，如果該方法有參數，預設會將原生事件物件event傳入。

這種在HTML元素上監聽事件的設計看似將DOM與JavaScript緊密耦合，違背分離的原理，其實剛好相反。因為透過HTML就可以知道呼叫的是哪個方法，將邏輯與DOM解耦，方便維護。

最重要的是，當viewModel銷毀時，所有的事件處理器都會自動銷毀，而無需自行處理。

Vue提供了一個特殊變數$event，用於存取原生DOM事件。

<div id="app">
    <a href="https://www.apple.com/" @click="handleClick(&#39;禁止打开&#39;,$event)">打开链接</a>
</div>

修飾符

Vue支援下列修飾符：

.stop

.prevent

.capture

#修飾函數#阻止點擊事件冒泡#提交事件不再重載頁面修飾符可以串連

	.self.once具體用法如下：
	#使用範例
	問題

##只當事件在該元素本身（不是子元素）觸發時執行回呼

只有修飾符
新增事件偵聽器時使用事件捕捉模式<p @click.capture="handle">...</p>	...

#只觸發一次，元件同樣適用

...

在表單元素上監聽鍵盤事件時，也可以使用按鍵修飾符。

修飾函數

使用範例

只有在

keyCode

是

13

時呼叫

vm.submit()

#

#############除了特定的某個keyCode外，Vue還提供了一些快速名稱：######.enter#####.tab#### ##.delete（補貨「刪除」和「退格」鍵）######.esc#######.space######.up#######.down# #####.left######.right######這些按鍵修飾符也可以組合使用，或和滑鼠一起使用：######.ctrl##### #.alt######.shift######.meta######這篇文章到這裡就已經全部結束了，更多關於vue.js的課程大家可以關注php中文網的###JavaScript影片教學###專欄！ ！ ！ ###

以上是Vue.js方法與事件的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！