그림 3-36 실행결과

그런데 입력 요소에 한글을 입력하면 문제가 발생합니다. 입력 요소에 한글을 직접 입력해 보세요. 6글자를 입력했는데 화면에는 5글자만 보입니다. 즉, 영문일 때와 달리 한글은 한 글자씩 늦게 인식됩니다.

그림 3-37 한글 입력 시 문제 발생

한글이나 한자처럼 글자를 조합해서 단어를 만드는 문자는 IME(Input Method Editor)를 사용하는데 이때 발생하는 문제입니다. 앞의 코드처럼 실시간으로 글자 수를 확인해야 할 때는 v-model 디렉티브를 사용할 수 없습니다. 그러면 어떻게 해야 할까요? 해결 방법은 있습니다. 이벤트를 사용해 수동으로 데이터를 업데이트하는 겁니다. 다음 절에서 알아보겠습니다.