vue表单已经赋值了，但是还是返回async-validator “xxx is required“提示，弹出验证红字而且不能输入

1. 验证规则的定义问题

首先检查一下你的验证规则是否正确。Vue 表单验证通常是用 rules 来设置的。如果字段值已经赋值，但仍然提示必填项错误，可能是规则写得有问题。你可以确保 xxx 字段的验证规则中 required 设置是正确的。
先确认字段值有没有初始化，也就是form里该字段有没有写上，先初始化
例如：

rules: {
  xxx: [
    { required: true, message: '联系人不能为空', trigger: 'blur' },
    // 其他验证规则
  ]
}

2. 表单初始化时赋值

确保在初始化表单数据时，你给字段 xxx 赋的值是有效的，并且在表单加载时数据已经完全赋值。

例如，在 Vue 组件中：

data() {
  return {
    form: {
      xxx: 'John Doe' // 确保这值已经初始化
    }
  }
}

3. 异步赋值

如果你在 mounted 或 created 中进行异步赋值，可能导致表单验证在字段值还没有赋值时就进行了验证。你可以确保在赋值之后再进行表单验证，或者手动触发验证。

例如，如果是异步赋值：

mounted() {
  // 异步获取数据后赋值
  setTimeout(() => {
    this.form.xxx= 'John Doe';
  }, 1000);  // 假设这是一秒后赋值
}

在这种情况下，可能需要延迟验证，可以在数据加载完之后调用 this.$refs.form.validate()。

4. 校验触发时机

Vue 的表单验证一般是在输入框失去焦点时或者提交时触发。如果你有动态表单数据或字段，你可能需要手动调用 validate 或 validateField 来重新触发验证。

例如：

this.$refs.form.validateField('xxx');

5. 数据绑定问题

确认你表单元素的数据绑定是否正确。在 Vue 中使用表单时，通常要用 v-model 来绑定数据。如果没有正确绑定，验证规则可能无法识别到正确的字段值。

<el-form :model="form" :rules="rules" ref="form">
  <el-form-item label="联系人" prop="shlxr">
    <el-input v-model="form.xxx"></el-input>
  </el-form-item>
</el-form>

6. 表单的校验方式

你可以手动触发校验，而不是依赖于自动校验。例如，在提交按钮上加上手动触发验证的代码：

submit() {
  this.$refs.form.validate((valid) => {
    if (valid) {
      // 提交数据
    } else {
      console.log('验证失败');
      return false;
    }
  });
}

7. 异常提示

如果表单在验证时直接禁用输入框，可以检查一下是否有 disabled 或者 readonly 属性绑定到输入框上。如果是使用了 async-validator 进行异步验证，确保这个验证规则的异步操作没有返回错误，导致表单被锁定。