Vue - watch를 이용한 정규식 사용

1. 한글 방지 input 만들기

<input type="text" v-model="userInfo"/>
<input type="text" v-model="onlyNumber" maxlength="11"/>

 

data(){
    return{
        userInfo:'',
        onlyNumber:'',
    }
},
watch:{
  userInfo(val){
        const reg = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;

      if(reg.exec(val)!==null){
      return this.userInfo = this.userInfo.slice(0,-1);
      }
  }
}

 

 

2. 숫자만 입력 가능한 input 만들기

watch:{
    onlyNumber(){
      return this.onlyNumber = this.onlyNumber.replace(/[^0-9]/g, '');
    }
},