강디너의 개발 일지

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

Javascript/Vue

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

강디너 2019. 9. 16. 19:29
728x90
반응형

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, '');
    }
},

'Javascript > Vue' 카테고리의 다른 글

Vue - Login 세션 유지하기  (2) 2019.11.24
Vue - filters 기능 이용한 콤마 찍기  (0) 2019.09.23
Vue - watch를 이용한 정규식 사용  (0) 2019.09.16
Vue - bundle size 분할하기  (0) 2019.08.25
Vue - Event Bus 사용법  (0) 2019.08.19
Vue에 익숙해지기 - Bingo(2)  (0) 2019.07.22
커피한잔...
0 Comments
댓글쓰기 폼