vue antd 一个表单域放置两个或多个表单控件的校验的问题优化

286 阅读1分钟

PC常用到的form表单,用ant design这个组件库通常是一个表单域放置一个表单控件,比如输入框,选择器,开关,单选框,多选框等,但有的时候需要我们自定义一个表单,要两个或者是多个,但这个时候就(会暴露出来一个校验的问题),要附于哪一个字段校验呢,不处理的话会不能实时校验,刚开始我是加一个新的字段,当这些选择的值都被填充时,赋予这个字段一个新的值,但是出现一个问题,他不能在表单输入完成之后自动及时消除,当时我还在想要是能有一个呃单独只校验一个字段的,方法就好了果然可以使用form实例的validateField属性

如下:

   this.$refs.form.validateField

 function(val) {
      if (val) {
        this.$set(this.model, 'goodUnit', 2)
      } else {
        this.$set(this.model, 'goodUnit', null)
      }             
      this.$refs.form.validateField('goodUnit', (val) => {
        if (!val) {
          return true
        } else {
          return false
        }
      })
    },