例如,el-form-item prop="nickname"
validate后该项为空,显示红色提示语
直接给this.fakeform.nickname赋值,不会改变改项的验证状态。
所以怎么才能在赋值后,只把赋值项的验证变了,而不是使用clearValidate清除所有验证信息
基于Monster 组和GPT的调写:
以下是示例代码:
<template>
<el-form ref="fakeform">
<el-form-item label="Nickname" prop="nickname">
<el-input v-model="nickname"></el-input>
</el-form-item>
</el-form>
<el-button @click="submitForm">Submit</el-button>
</template>
<script>
export default {
data() {
return {
nickname: '',
};
},
methods: {
submitForm() {
this.$refs.fakeform.validate((valid) => {
if (valid) {
// 表单验证通过
// 处理表单数据
} else {
// 表单验证失败
// do something
}
});
},
updateNickname() {
// 给 nickname 赋值
this.nickname = 'new nickname';
// 验证 nickname 字段
this.$refs.fakeform.validateField('nickname');
},
},
};
</script>
可以在校验规则中将trigger触发方式改为trigger:change 改变时触发校验
rules:{
name: [
{ type: 'date', required: true, message: '请输入姓名', trigger: 'change' }
],
}