form & v-model, @input

input value에 양방향 바인딩을 하려면 어떻게 해야할까?

<input v-model="데이터이름" /> 을 하면된다.

 

v-model 사용시 한글이 바로바로 반영이 안되는데 어떻게 해야할까?

<input @input="핸들러 이름" /> 을 통해 데이터의 값을 변경해주면 된다.

핸들러에는 this.데이터이름 = event.target.value 코드가 포함되어야 한다.

 

@input사용시 처음 렌더링 되면 초기값이 없는데 초기값을 Vue에 정의된 데이터 값으로 하려면?

:value = "데이터이름"으로 단방향 바인딩을 해준다.

<input @input="핸들러이름" :value="데이터이름">

 

아래 예시를 통해 직접 확인해보면 된다.