[Vue.js] input에 숫자만 입력가능하게 2 (한글 자음/모음 입력방지)
in FrontEnd
한글은 받침이 있는 문자라 (중국어 일어도 원리는 같다고 한다)
글자단위가 아니라 자음 모음 단위로 구분이 되게 되어있어 어쨌거나 한 모음/자음만 입력되면
그게 또 그대로 먹어버린다는 말씀
알파벳은 아예 입력자체가 안되는데
한글을 (예를들어) ㅇ을 누르고 포커스가 해제되면 input값에 ㅇ이 남아있다
궁극적으로는 한국인들은 (혹은 동양권 개발자들은) 이 문제를 따로 별도 방식으로 해결해줄 수밖에없다는 말씀
나는 검색input같은 경우에는 아예 컴포넌트로 빼서 사용했는데
이 숫자입력까지 그렇게 할 수는 없어서 찾고 찾았더니
watch를 이용하는 방법이 있었다.
watch도 참 여러곳에 사용되는군… 유용해
watch:{
number(val){
const reg = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;
if(reg.exec(val)!==null) this.number = this.number.slice(0,-1);
return this.amnumbert1=this.number.replace(/[^-\.0-9]/g,'');
}
},
이런식으로 한글을 제외하는 정규식을 넣어서 사용하면 된다.
마지막 한글자를 잘라내라는 문장과 함께 나같은 경우에는 소수점은 또 입력되게 했어야했어서
return은 소수점입력은 되도록 했다!