brograming
회원가입 _정규표현식 * validate 사용해보기* 본문
template
<input class="input-item" type="text" v-model="name" placeholder="NAME" on:click=""><br/>
<span class ="font_id_red" v-show="isNameCheck">한글 또는 영어만 허용합니다</span><br/>
watch
watch : {
'name': function(){
this.checkName()
}
}
Methods
checkName(){
const validateName = /^[가-힣a-zA-Z]+$/;
if(!validateName.test(this.name)){
this.isNameCheck = true;
}else{
this.isNameCheck = false;
}
}
참고 자료
[JS] 정규표현식(특수문자, 숫자 등)
정규 표현식은 문자열에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴이다. 이 패턴들은 RegExp의 exec 메소드와 test 메소드 ,그리고 String의 match메소드 , replace메소드 , search메소드 , spli
velog.io
https://hamait.tistory.com/342
정규표현식 (Regex) 정리
정규표현식은 아주 가끔 쓰기때문에 항상 다시 볼때마다 헷갈리곤 하기에 주요 사용예를 내가 나중에 다시 봤을 때 편하도록 정리하여 보았다. 정규 표현식의 용어들정규 표현식에서 사용되는
hamait.tistory.com
[TIL # 46] Vue 이메일/비밀번호 유효성 검사
Vue 이메일/비밀번호 유효성 검사에 따른 DOM 제어
velog.io
비밀번호 확인 : https://hjh0827.tistory.com/24
vue.js - jquery 없이 만들어 보는 회원 가입 1탄
요새 vue.js를 공부하다보니 jquery 없이 충분히 개발을 할수 있을것 같다는 생각에 간단한 회원 가입 화면을 만들어 보려고 합니다. 바로 시작하겠습니다. 회원가입 flow 1p - 가입 정보(아이디, 비밀
hjh0827.tistory.com
validate
https://balmostory.tistory.com/28
veevalidate로 회원가입페이지 구현 예시
vlavalidate를 사용하는 이유는 예를 들어 회원가입 시 필수 항목에 제대로 입력을 했는지, 이메일 형식은 올바른지 바로바로 오류를 표시해 주기 위함이다. npm i vee-validate 1. npm을 통해 모듈을 다운
balmostory.tistory.com
https://velog.io/@sumniee/vue-formulate
vue-formulate
이전 코드 필수입력은 모든 항목 유효성 검사 기업정보, 추천인코드와 같은 선택항목 입력 시 유효성 검사 회원가입버튼 클릭 후 통과되지 않은 필드들은 watch 사용해서 변경되면 유효성 검사 va
velog.io
https://jeonghwan-kim.github.io/dev/2020/06/08/html5-form-validation.html
HTML5 폼 검증에 대해 정리해 보자
폼(Form)은 웹 개발 할 때 반드시 다뤄야 하는 기술이다. 로그인 화면, 글 작성 화면, 데이터를 다루는 커머는 어드민 화면까지 폼은 웹 개발에 있어서 폭넓게 사용되고 있다. 돌이켜 보면 그 때마
jeonghwan-kim.github.io
https://reverse-ant-success.tistory.com/220
116. 사용자 폼 유효성 검사 | email 방식인지 체크 | :disabled="!isUsernameValid || !password"
< 하고 싶은것 > 1. username input이 email이 아닐 경우에 비활성화 처리 - 정규표현식 필요 (이미 잘 만들어져 있는걸 사용하자) - computed 속성 필요 2. 아이디, 패스워드가 없으면 로그인버튼 비활성화
reverse-ant-success.tistory.com
'[petmily]' 카테고리의 다른 글
| 회원가입 _ 이메일 인증 (0) | 2023.06.20 |
|---|