Graceful Light

Vee-Validate Custom Validation

2017-10-15


커스텀 validation을 추가해야할 때가 있다.
created에 $validator 인스턴스를 확장해주면 된다.

소스

1
2
3
4
5
6
7
8
9
10
11
12
created: function() {
this.$validator.extend('customRule', {
getMessage: function(field, args) {
return '오류 메세지';
},
validate: function(value, args) {
// 체크 로직
return true;
}
});
}

모듈형태거나 전역설정이면 import { Validator } from 'vee-validate'; 후에 Validator.extend로 접근하면 된다.

사용법

추가한 룰 이름으로 v-validate 속성에 넣어주면 끝이다.

1
<input type="text" name="help" v-validate="'required|customeRule'"/>

스크립트 상에서 추가

attach 메소드로 붙히면 된다.

1
this.$validator.attach('help', 'customRule');

다른 사용법은 공식문서를 참조하자

🍺

Buy me a beer 🍗

공유하려면 QR코드를 스캔해주세요