手动设置值，this.$refs.myForm.validateField校验不通过，validate()时校验通过

手动设置表单项的值后，validateField 校验不通过但 validate 校验通过的原因可能是由于 validate 和 validateField 校验的方式不同，validate 校验方式会对整个表单进行校验，而 validateField 校验方式只对单个表单项进行校验。

如果手动设置值后，validateField 校验不通过但 validate 校验通过，可能有以下原因：

1. validateField 校验只对当前设置值的表单项进行校验，如果该表单项依赖于其他表单项的值，则可能会出现 validateField 校验不通过但 validate 校验通过的情况。此时，可以尝试手动设置依赖表单项的值，然后再调用 validateField 函数进行校验。

2. validateField 校验只对某些特定的校验规则进行校验，如果该表单项的校验规则不在 validateField 校验的范围内，则可能会出现 validateField 校验不通过但 validate 校验通过的情况。此时，可以检查校验规则是否正确地设置，并尝试调整校验规则。

3. validateField 校验方式可能存在 bug，可以尝试使用其他校验方式或者修改校验方式。

希望以上的解决方案能对你有所帮助。

相关问题

el-form手动校验

el-form 提供了手动触发校验的方法 validate，可以通过该方法来进行表单校验。具体操作步骤如下：

1. 给 el-form 组件设置 ref 属性，例如：`<el-form ref="myForm">`。

2. 在需要触发校验的时候，调用该组件的 `validate` 方法，例如：`this.$refs.myForm.validate((valid) => {...})`。

3. `validate` 方法接收一个回调函数，当校验完成后会自动调用该回调函数，并传入一个表示校验结果的参数 valid。

4. 在回调函数中可以根据校验结果 valid 来进行相应的操作，例如提交表单或者提示用户输入有误等。

需要注意的是，如果 el-form 中有需要校验的 el-form-item 组件，那么在调用 validate 方法之前需要先手动触发这些 el-form-item 的校验，可以通过调用它们的 `validate` 方法来实现，例如：`this.$refs.myFormItem.validate()`。

vue结合element ui 怎么做到点击按钮时出发校验

在 Vue.js 中结合 Element UI 进行表单校验，可以使用 Element UI 提供的 el-form 组件和 el-form-item 组件，以及 Vue.js 提供的 $refs 方法。

在 el-form-item 组件上添加 prop 属性，该属性的值为要校验的字段名：

<el-form ref="myForm">
  <el-form-item label="用户名" prop="username">
    <el-input v-model="form.username"></el-input>
  </el-form-item>
  <el-form-item label="密码" prop="password">
    <el-input type="password" v-model="form.password"></el-input>
  </el-form-item>
</el-form>

在 el-form 组件上添加 rules 属性，该属性的值为一个对象，其中 key 是要校验的字段名，value 是一个数组，用来定义校验规则：

data() {
  return {
    form: {
      username: '',
      password: ''
    },
    rules: {
      username: [
        { required: true, message: '请输入用户名', trigger: 'blur' },
        { min: 3, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur' }
      ],
      password: [
        { required: true, message: '请输入密码', trigger: 'blur' },
        { min: 6, max: 20, message: '长度在 6 到 20 个字符', trigger: 'blur' }
      ]
    }
  }
},

在点击提交按钮时，可以通过 this.$refs.myForm.validate() 方法，来触发表单校验。如果校验通过，返回 true，否则返回 false：

methods: {
  submitForm() {
    this.$refs.myForm.validate((valid) => {
      if (valid) {
        // 表单校验通过，执行提交操作
      } else {
        // 校验失败，不执行提交操作
        return false;
      }
    });
  }
}

在这个例子中，如果表单校验不通过，就会阻止提交操作，并且不会触发后续操作，如果表单校验通过，就会执行提交操作。