antd vue表单校验中，自定义组件校验时错误提示不自动消失的问题

2024-07-14 14:08| 来源: 网络整理| 查看: 265

原本antd自己的组件使用v-model:value即可自动显示隐藏错误提示，如下：

// 因为与子组件写法无关，子组件代码不展示了

但是自定义组件使用v-model:value会报错。需做如下处理：

// 在标签中添加ref属性 import {ref,watch} from 'vue' const chooseTimeEle = ref() // 模型详情 const modelDetail = ref({ ruleInfo: { timeRule: { timeInfo: { dimensionTime: '天', value: null } } } }) // 监听 watch(modelDetail.value,(newVal) => { if(modelDetail.value.ruleInfo.timeRule.timeInfo.value){ chooseTimeEle.value.clearValidate() } })

做如上配置可实现错误自动隐藏

参考：ant design vue自定义表单验证不生效和自定义校验内容有值后自动清除警告的方法

【本文地址】

公司简介

联系我们