Vue elemen ui 移除上次校验与部分清除上次校验

场景:

可以切换类型,下面的输入框参数也会随着改变。

如果不清除上次的校验就会出现,之前的大陆企业的校验还会出现在香港企业的校验中

方法:
javascript 复制代码
watch:{

'ruleForm.paymentSubjectType':{  通过监听表单的类型来调用 clearValidate方法
    handler(val,oldVal){
        if (val != oldVal) {
        this.$nextTick(() => {
            this.$refs.payForm.clearValidate();
          });
        }
    }
  }

}

也可以在这里动态修改表单的校验信息的提示语

javascript 复制代码
可以在这获取到自定义ref的表单的各种属性,这里的情况是参数名一样但是提示语要不一样
watch:{
'ruleForm.paymentSubjectType':{
    handler(val, oldVal) {
        if (val == "HK-ENTERPRISE") {
          this.$refs.payForm.rules.paymentSubjectName[0].message =
            " 请输入收款香港企业名称";
          this.$refs.payForm.rules.paymentSubjectName[1].message =
            "输入的收款香港企业名称过长";
        } else {
          this.$refs.payForm.rules.paymentSubjectName[0].message =
            " 请输入收款企业名称";
          this.$refs.payForm.rules.paymentSubjectName[1].message =
            "输入的收款企业名称过长";
        }
 
  }


}

部分清除校验就是在item里面绑定不同的key,或者隐藏的item的父级div上

javascript 复制代码
<el-form-item key="unque"></el-form-item>
相关推荐
麦麦大数据29 分钟前
F032 材料科学文献知识图谱可视化分析系统(四种知识图谱可视化布局) | vue + flask + echarts + d3.js 实现
vue.js·flask·知识图谱·数据可视化·论文文献·1024程序员节·科研图谱
web打印社区2 小时前
使用React如何静默打印页面:完整的前端打印解决方案
前端·javascript·vue.js·react.js·pdf·1024程序员节
喜欢踢足球的老罗2 小时前
[特殊字符] PM2 入门实战:从 0 到线上托管 React SPA
前端·react.js·前端框架
小光学长2 小时前
基于Vue的课程达成度分析系统t84pzgwk(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
前端·数据库·vue.js
Baklib梅梅3 小时前
探码科技再获“专精特新”认定:Baklib引领AI内容管理新方向
前端·ruby on rails·前端框架·ruby
南方以南_3 小时前
Chrome开发者工具
前端·chrome
YiHanXii3 小时前
this 输出题
前端·javascript·1024程序员节
楊无好3 小时前
React中ref
前端·react.js
维他命Coco3 小时前
js常见开发学习
javascript
程琬清君3 小时前
vue3 confirm倒计时
前端·1024程序员节