템플릿 디렉티브 믹스

Vue.js 가이드의 내용에 따라, keyup, keydown 등의 이벤트를 @keyup 디렉티브로 사용 해 왔다.

 

https://vuejs.org/v2/guide/events.html#System-Modifier-Keys

Event Handling — Vue.js

이곳을 보면 이벤트 디렉티브에 키 조합이 사용 가능한 것을 알수있다.

 

alt+key 라던가, ctrl+key 라던가..

 

대표적으로 @keyup.enter 를 많이 쓰게 되는데, 이 중 "enter" 부분은 key code로도 대체 가능하다.

 

@keyup.enter == @keyup.13

 

input element 에서는 특정 키에 대해서 이벤트 발생을 막을때가 있는데,

 

이또한 디렉티브 조합으로 가능하다.

<input type="text" @keydown.13.prevent>

자세한 내용은 위에 링크 된 문서를 보면 될듯 하다.