Notice
Recent Posts
Recent Comments
Link
«   2026/03   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

brograming

회원가입 _정규표현식 * validate 사용해보기* 본문

[petmily]

회원가입 _정규표현식 * validate 사용해보기*

brograming 2023. 6. 20. 00:03

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;
    }
    }

참고 자료

 

 

정규표현식 : https://velog.io/@jangws/JS-%EC%A0%95%EA%B7%9C%ED%91%9C%ED%98%84%EC%8B%9D%ED%8A%B9%EC%88%98%EB%AC%B8%EC%9E%90-%EC%88%AB%EC%9E%90-%EB%93%B1-6766k8d6

 

[JS] 정규표현식(특수문자, 숫자 등)

정규 표현식은 문자열에 나타는 특정 문자 조합과 대응시키기 위해 사용되는 패턴이다. 이 패턴들은 RegExp의 exec 메소드와 test 메소드 ,그리고 String의 match메소드 , replace메소드 , search메소드 , spli

velog.io

https://hamait.tistory.com/342

 

정규표현식 (Regex) 정리

정규표현식은 아주 가끔 쓰기때문에 항상 다시 볼때마다 헷갈리곤 하기에 주요 사용예를 내가 나중에 다시 봤을 때 편하도록 정리하여 보았다. 정규 표현식의 용어들정규 표현식에서 사용되는

hamait.tistory.com


이메일 / 비밀번호 : https://velog.io/@yejine2/TIL-46-Vue-%EC%9C%A0%ED%9A%A8%EC%84%B1%EA%B2%80%EC%82%AC#%EC%9D%B4%EB%A9%94%EC%9D%BC-%ED%98%95%EC%8B%9D-%EA%B2%80%EC%82%AC

 

[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