如何在字段的校验中触发对另一个字段的校验

[srarcbrsent]

rule: {
    v1: [
        {
            validator: (rule, value, callback) => {
                // 校验逻辑
            }
        },
    ]
    v2: [
        {
            validator: (rule, value, callback) => {
                // 校验逻辑
                // 触发v1的校验
            }
        }
    ]
}

比如校验要求是v1和v2的求和结果等于1 初始状态v1等于0.5，v2等于0.5，修改v1为0.1，此时v1为报错状态，在修改v2为0.9，此时v1仍然处于报错状态，如何在v2的校验逻辑中主动的触发对v1的校验

[wawaPoplar]

同问呀

[ZJH9Rondo]

你在传入参数的时候，传入一个 this，他会被包含在 options 中，这样无论是同步校验还是异步校验都可以获取到，或者说，你可以理解为这个 this 就是一个可以获取到你需要触发校验的具柄就行。

[ZJH9Rondo]

@srarcbrsent @wawaPoplar

[ll372486496]

你在传入参数的时候，传入一个 this，他会被包含在 options 中，这样无论是同步校验还是异步校验都可以获取到，或者说，你可以理解为这个 this 就是一个可以获取到你需要触发校验的具柄就行。

可以给个例子吗

[macarole]

第二次遇到这个问题了，还是不知道具体怎么操作。上次还遇到动态添加成对相互依存项。。。。 这次我又遇到了两个字段不能同时为空的校验，有点相互依赖的意思，怎么处理呀各位大哥，先行谢过

[ZJH9Rondo]

@ll372486496 @macarole 就是传入一个this，保证能够在异步校验逻辑中能够获取到你所需要的参数，至于相互依赖，触发校验得看你设置的到底是 focus 还是 blur 这些，你给你需要校验的输入dom 再次 focus 再 blur 就触发了，我是这么理解的，去试一下就知道了，我之前就是试出来的，具体代码前不久删了，没有了，不复杂的，就是那个配置，需要具体操作触发什么的，传入this 活着 dom ，调用处理就行了

[summermacarole]

@ll372486496 @macarole 就是传入一个this，保证能够在异步校验逻辑中能够获取到你所需要的参数，至于相互依赖，触发校验得看你设置的到底是 focus 还是 blur 这些，你给你需要校验的输入dom 再次 focus 再 blur 就触发了，我是这么理解的，去试一下就知道了，我之前就是试出来的，具体代码前不久删了，没有了，不复杂的，就是那个配置，需要具体操作触发什么的，传入this 活着 dom ，调用处理就行了

抱歉，我没能理解透你所说的意思。我这次的需求是两个字段，不能同时为空的校验，我试了很多办法，还是没有找到完美的方案，你看能不能帮忙指导下

[SmartSmallFish]

@srarcbrsent @ll372486496 @summermacarole @wawaPoplar 各位，这个问题又找到解决方法或者其他替代方案吗

[Duan112358]

• 设置表单字段的时候，传入上下文

export default context => [{
  label: '确认密码',
  name: 'confirm_passwd',
  component: 'a-input',
  decorator: [
    'confirm_passwd', {
      rules: [{
        required: true,
        validator: (rule, value, next) => {
          const isValid = !Number(value)
          if (isValid) {
            next('请输入确认密码')
            return
          }
         // 这里通过 context 获取绑定的 model 对象中其他字段的值
          if (context.model.passwd !== value) {
            next('密码和确认密码不一致')
            return
          }
          next()
        }
      }]
    }
  ],
  props: {
    placeholder: '确认密码',
    type: 'password'
  }
}, 
...]

• 组件中的使用规则( Vue 为例)

import createColumns from './columns-config'
...
computed: {
  columns: () => {
   // 这里传入上下文
    createColumns(this)
  }
}

• Template 模版中使用配置

      <a-form :form="form">
        <a-form-item
          v-for="item in columns"
          :key="item.name"
          :label="item.label">
          <component
            v-bind="item.props"
            v-decorator="item.decorator"
            :is="item.component">
          </component>
        </a-form-item>
      </a-form>

[jddk]

先吐槽一下楼上,什么鬼传入一个this........ validateField对部分表单字段进行校验的方法 callback()前使用validateField方法触发两外一个字段的验证

setTimeout(() => {
   this.$refs.form.validateField('YourFieldName');
  });
  callback();

如果你要浏览详细的可以查看我的博客 elementUI中async-validator两个表单项之间有依赖关系的验证方法

[ZJH9Rondo]

先吐槽一下楼上,什么鬼传入一个this........ validateField对部分表单字段进行校验的方法 callback()前使用validateField方法触发两外一个字段的验证

setTimeout(() => {
   this.$refs.form.validateField('YourFieldName');
  });
  callback();

如果你要浏览详细的可以查看我的博客 elementUI中async-validator两个表单项之间有依赖关系的验证方法

其实你这个写法跟我说的那个没有什么差别，你是主动调validate的方法，这个方法在内部可以通过你设置的form的prop拿到你需要拿到的值，我说的那个是直接通过保留的this去取那个值，在你需要验证的地方去验证你想验证的这个值就可以了，只是我说的那种不是最规范的写法

[six-ben]

先吐槽一下楼上,什么鬼传入一个this........ validateField对部分表单字段进行校验的方法 callback()前使用validateField方法触发两外一个字段的验证

setTimeout(() => {
   this.$refs.form.validateField('YourFieldName');
  });
  callback();

如果你要浏览详细的可以查看我的博客 elementUI中async-validator两个表单项之间有依赖关系的验证方法

可行

[hicjcn]

这个确实是一个大坑的，如果是一个list的动态表单，没法做到同一行数据的的对比（根据同一行的数据设定做不同的逻辑判断），这个的校验确实很不友好

[hello-pw]

if this single vue only has a form , you can use 'validate(item.name)' redirectly in validator when you want to async check another item in a item.

[qinyuanbin]

validator: (r, v1, setErr) {
  if (!isValid(v1)) {
    setErr('v1 error');
  } else {
    setErr(null);
  }

  // validate v2 fileds, avoid loop
  if (form.getFieldError('v2')) {
    form.validateFields(['v2']);
  }
}