When it comes to form validation, Vuetify has a multitude of integrations and baked in functionality. Want to use a 3rd party validation plugin? Out of the box you can use Vee-validate and vuelidate.
Le composant interne v-form permet d'ajouter facilement la validation aux entrées de formulaire. Tous les composants d'entrée ont une proprules qui prend un tableau de fonctions. Ces fonctions vous permettent de spécifier les conditions dans lesquelles le champ est valide ou invalide. Chaque fois que la valeur d'une entrée est modifiée, chaque fonction dans le tableau recevra la nouvelle valeur. Si une fonction retourne false ou une chaîne, la validation a échoué.
Sélectionnez le composant désiré ci-dessous afin de voir les props, slots, événements et méthodes disponibles.
Vous trouverez ci-dessous une collection d'exemples simples ou complexes.
Les règles vous permettent d'appliquer une validation personnalisée sur tous les composants de formulaire. Ces derniers sont validés séquentiellement et afficheront un maximum d'une erreur à la fois, assurez-vous donc de commander vos règles en conséquence.
Le composant v-form a trois fonctions qui peuvent être accessibles en définissant un ref sur le composant. Un ref nous permet d'accéder aux méthodes internes d'un composant, par exemple, <v-form ref="form">.
ceci.$refs.form.validate() validera toutes les entrées et retournera s'ils sont tous valides ou non. ceci.$refs.form.reset() effacera toutes les entrées et réinitialisera leurs erreurs de validation. ceci.$refs.form.resetValidation() ne réinitialisera la validation de l'entrée et ne modifiera pas leur état.
vuelidate is a simple, lightweight model-based validation for Vue.js. Documentation
vee-validate is a template Based Validation Framework for Vue.js. Documentation
Prêt pour plus ? Continuez la lecture avec :