v- 開頭
1. v-on 兩種修飾符
1)事件修飾符(4種)
prevent,stop,capture,self
詳細(xì)說(shuō)明:
prevent: preventDefault() 阻止事件的默認(rèn)行為
stop: stopPropagation() 阻止事件冒泡
capture: 表示添加事件偵聽器時(shí)采用 capture 即捕獲模式
示例代碼:
<div v-on:click.capture='doThis'>...</div>
self: 只有當(dāng)事件作用在該元素本身(而不是子元素),觸發(fā)時(shí)觸發(fā)回調(diào)
示例代碼:
<div v-on:click.self='doSomething'>...</div>
2)按鍵修飾符(監(jiān)聽鍵盤事件)
記住 keyCode 比較困難,Vue.js 提供了別名
- enter (keyCode: 13)
- tab (keyCode: 9)
- delete (keyCode: 8, 46)
- esc (keyCode: 27)
- space (keyCode: 32)
- up (keyCode: 38)
- dowm (keyCode: 40)
- left (keyCode: 37)
- right (keyCode: 39)
示例:
只有在回車時(shí)調(diào)用 vm.submit()
<input v-on:keyup.13='submit'></input>
或:
<input v-on:keyup.enter='submit'></input>
縮寫語(yǔ)法:
<input @keyup.enter='submit'></input>