더북(TheBook)

3.4.1 v-on 디렉티브와 methods 옵션 속성으로 이벤트 연결하기

뷰에서는 v-on 디렉티브로 이벤트를 쉽게 연결할 수 있습니다. v-on 디렉티브는 다음 형식으로 사용합니다.

형식

v-on:이벤트_타입="이벤트_핸들러"

여기서 이벤트 타입( click, keyup, keydown 등)은 이벤트 종류를 식별하는 문자열로 자바스크립트와 개념이 같습니다. 그리고 이벤트 핸들러는 이벤트 타입과 일치하는 이벤트가 발생하면 실행되는 함수입니다. 뷰에서 값을 data 옵션 속성으로 정의했다면, 메서드는 methods 옵션 속성으로 정의합니다.

형식

<script>
export default {
  methods: {}, // 메서드 정의
}
</script>

TIP - 자바스크립트의 이벤트 타입에 관한 자세한 정보는 MDN 웹 문서(https://developer.mozilla.org/en-US/docs/Web/API/Element)에서 확인할 수 있습니다.

 

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.