성장과정(dev)/Frontend(feat. Vue, Next.js)

[vue] 이벤트 호출 시 default parameter에 추가 파라미터 보내기

lowellSunny 2021. 11. 30. 14:58

vue dom에 이벤트가 걸려있을 때, Default 로 보내주는 parameter가 있다. 

예를 들어 @input="testmethod" 이벤트를 넣어놓으면 

 

methods에 정의되어있는 testmethod 함수에서 console로 이벤트를 찍어보면

 

testmethod( e ) {

   console.log(e)

}

e는 해당 input dom 에 들어온 텍스트로 찍힌다.

 

그런데 여기서 해당 텍스트 이외에 다른 파라미터를 추가로 받아오고싶은 경우가 있다.

그럴때는 

<b-form-input @input="autoNext( $event, 4 )" type="text" size="sm" :disabled="!editableInputData" placeholder="YYYY" style="width:60px;"
                                      class="d-inline-block"
                                      v-model="birthDate.year"/>

이런식으로 정의 하면

default로 가져오는 파라미터에 추가로 내가 넣은 파리터까지 받아올 수 있다.

 

methods : {

	autoNext( e, count ) {
    
    	console.log( "param ::: ", e, count );	// `param ::: 입력한값, 4` 이런식으로 출력된다.
    }
}

 

 

 

 

 

 

이와 같은 기능은 vue 공식 페이지에서 확인할 수 있다.
출처 : https://kr.vuejs.org/v2/guide/events.html