Vue取消表单校验提示的方法

正确方法:

javascript 复制代码
this.$refs["myform"].clearValidate();

不要使用,因为它会清楚提示的同时把表单值还原为初始值

javascript 复制代码
this.$refs["myform"].resetFields();

完整代码:

html 复制代码
<a-form-model :model="myform" ref="myform" :rules="rules">
            <a-form-model-item label="名称" prop="name">
              <a-input v-model="myform.name"></a-input>
            </a-form-model-item>
</a-form-model>
javascript 复制代码
data() {
      return {
        myform: {
          name: ''
        },
        rules:{
              //表单验证
              name: [{ required: true, message: '必填', trigger: 'blur' },
        },
},
...
watch:{
        myform: {
            handler(newObj,oldObj){
                if(newObj.name!=""){
                    this.$refs["myform"].clearValidate(); //清除所有校验规则
                }
            },
            deep:true
        }
},
相关推荐
一 乐14 分钟前
汽车租赁|基于SprinBoot+vue的汽车租赁管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·汽车·论文·毕设·汽车租赁管理系统
修己xj1 小时前
打造专属博文封面神器:一个开源免费的博文封面生成器ThisCover
前端
kyriewen1 小时前
面试8家前端岗位后,我发现了一个残酷的事实:AI不是加分项,是门槛
前端·javascript·面试
Fighting_p1 小时前
【面试 - el-select问题及解决】wujie 微前端下子系统 el-select 多选 filterable 过滤失效
前端
吃口巧乐兹1 小时前
AI 全栈时代,为什么要服务端使用 NestJs
前端
yingyima1 小时前
Redis 延迟任务队列:凌晨3点服务器报警的救星
前端
weiggle1 小时前
第三篇:可组合函数(Composable)——Compose 的基石
android·前端
前端环境观察室1 小时前
别只看 task success:AI Agent 浏览器自动化真正要补的是环境证据链
前端·后端
huakoh1 小时前
LangChain 实战:用混合检索啃下 1000 页 PDF,搭一个长文档问答 Agent
前端
Dazer0071 小时前
Edge 浏览器绕过 HTTPS 证书错误
前端·https·edge