elementUI el-form表单校验不消失 强制去掉校验
在Element UI中,如果你想要强制去掉el-form表单的验证信息,可以通过重置表单验证对象的fields属性来实现。以下是一个简单的示例代码:
<template>
<el-form ref="formRef" :model="form" :rules="rules">
<el-form-item prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
<!-- 其他表单项 -->
<el-button @click="submitForm">提交</el-button>
<el-button @click="clearValidation">清除验证</el-button>
</el-form>
</template>
<script>
export default {
data() {
return {
form: {
name: ''
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
],
// 其他表单规则
}
};
},
methods: {
submitForm() {
this.$refs.formRef.validate(valid => {
if (valid) {
// 提交表单逻辑
} else {
console.log('表单验证失败');
return false;
}
});
},
clearValidation() {
// 清除验证信息
this.$refs.formRef.resetFields();
}
}
};
</script>
在上述代码中,el-form
组件通过 ref
属性被引用,并且绑定了一个表单验证对象 rules
。clearValidation
方法通过调用 this.$refs.formRef.resetFields()
来清除表单验证信息。这会移除表单项的验证结果并恢复到初始状态。
评论已关闭