Pour vérifier de manière personnalisée la valeur d'un champ de formulaire dans el-form, vous pouvez utiliser une fonction de vérification personnalisée. Vous pouvez le faire en définissant l'attribut prop et l'attribut Rules sur el-form-item.
Voici un exemple:
<el-form ref="form" :model="formData" label-width="120px">
<el-form-item label="名称" prop="name" :rules="[{ validator: validateName }]">
<el-input v-model="formData.name"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">提交</el-button>
</el-form-item>
</el-form>
Dans l'exemple ci-dessus, nous avons ajouté l'attribut prop à el-form-item. La valeur de l'attribut prop doit correspondre au nom du champ dans l'objet formData. Dans le même temps, la fonction de validation personnalisée validateName est spécifiée dans el-form-item via l'attribut Rules.
Ensuite, définissez la fonction de vérification validateName dans le composant Vue :
export default {
data() {
return {
formData: {
name: ''
}
};
},
methods: {
validateName(rule, value, callback) {
// 进行自定义校验逻辑
if (value === 'admin') {
callback(new Error('名称不能为 admin'));
} else {
callback();
}
},
submitForm() {
this.$refs.form.validate((valid) => {
if (valid) {
// 校验通过，进行表单提交操作
console.log('表单校验通过');
} else {
// 校验不通过，进行错误处理
console.log('表单校验未通过');
}
});
}
}
};
Dans le code ci-dessus, le nom saisi est vérifié personnalisé via la fonction validateName. Si le nom est « admin », appelez la fonction de rappel pour transmettre les informations d'erreur, sinon appelez la fonction de rappel sans transmettre aucun paramètre. En même temps, dans cette fonction, les données contenues dans les données peuvent également être utilisées comme référence pour le jugement.
Enfin, nous appelons la méthode validate de el-form dans la méthode submitForm pour déclencher la vérification du formulaire. Dans la fonction de rappel, effectuez le traitement correspondant en fonction des résultats de la vérification.
Grâce aux étapes ci-dessus, vous pouvez personnaliser la valeur d'un champ de formulaire dans el-form.