[Vue.js] input에 숫자만 입력가능하게 2 (한글 자음/모음 입력방지)


한글은 받침이 있는 문자라 (중국어 일어도 원리는 같다고 한다)

글자단위가 아니라 자음 모음 단위로 구분이 되게 되어있어 어쨌거나 한 모음/자음만 입력되면

그게 또 그대로 먹어버린다는 말씀

알파벳은 아예 입력자체가 안되는데

한글을 (예를들어) ㅇ을 누르고 포커스가 해제되면 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은 소수점입력은 되도록 했다!




© 2018. by sora

Powered by sora