폼 (Form)
Vuetify 는 폼 유효성 검사(validation)과 관련하여 다양한 통합기능을 가지고 있고 기능면에서 숙성되어 있습니다. 서드파티(3rd party) 플러긴을 사용하고 싶습니까? Out of the box you can use Vee-validate and vuelidate.
사용법
The internal v-form component makes it easy to add validation to form inputs. All input components have a rules prop which takes an array of functions. These functions allow you to specify conditions in which the field is valid or invalid. Whenever the value of an input is changed, each function in the array will receive the new value. If a function returns false or a string, validation has failed.
API
value 는 검사 에러(validation error) 가 표시될때 까지 vallue 가 무조건 true가 됩니다. 검사를 수동으로 호출하려면 여전히 validate() 함수를 호출할 수 있습니다.
표시여부를 조절 (Controls visibility)
예제
Creating rules
Rules allow you to apply custom validation on all form components. These are validated sequentially and will display a maximum of 1 error at a time, so make sure you order your rules accordingly.
서브밋/클리어 유효성 검사 (Validation with submit & clear)
v-form 컴포넌트는 ref를 설정하여 액세스할 수 있는 두 개의 함수를 가지고 있습니다. validate() 함수는 모든 입력값에 대해 유효성을 검사하고 모두 유효한지를 리턴합니다. reset() 함수는 모든 인풋(inputs)에서 유효성 검사 에러를 제거합니다.
Vuelidate
Vee-validate
Vee-validate 폼을 체크하는 것을 도와주는 또 다른 유효성 검사 플러그인입니다. 한가지 주의사항(caveat)은 value prop을 사용할때 v-checkbox를 제대로 검사하기 위해 반드시 type="checkbox" 를 추가해야 한다는 점입니다