能否给出elementui的代码

当然可以，以下是使用 ElementUI 实现回显数据校验的示例代码：

<template>
  <div>
    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
      <el-form-item label="Name" prop="name">
        <el-input v-model="form.name" @blur="validateInput('name')" :class="{ 'is-invalid': errors.name }"></el-input>
        <div v-if="errors.name" class="el-form-item__error">{{ errors.name[0] }}</div>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm">Submit</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        name: '', // 回显的数据
      },
      rules: {
        name: [
          { required: true, message: 'Name is required', trigger: 'blur' },
          { min: 3, message: 'Name must be at least 3 characters long', trigger: 'blur' },
        ],
      },
      errors: {}, // 校验错误信息
    };
  },
  methods: {
    submitForm() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          // 表单校验成功，提交表单数据
        } else {
          // 表单校验失败
        }
      });
    },
    validateInput(field) {
      this.$refs.form.validateField(field, (err) => {
        if (err) {
          this.errors[field] = err;
        } else {
          this.errors[field] = '';
        }
      });
    },
  },
  mounted() {
    // 在组件挂载时手动触发一次校验函数
    this.validateInput('name');
  },
};
</script>

在上面的代码中，我们使用了 ElementUI 的表单组件来实现表单校验。在 `data` 中定义了 `form` 对象来保存表单数据，在 `rules` 中定义了 `name` 属性的校验规则。在模板中，我们使用了 `$refs` 来引用表单组件，并使用 `validate` 和 `validateField` 方法来实现表单的校验。

在 `mounted` 钩子函数中，我们手动触发了一次校验函数。在回显数据时，可以通过调用 `validateInput` 方法来触发校验函数，从而检查回显数据的合法性。

需要注意的是，在提交表单时，我们需要手动触发一次 `validate` 方法，来检查用户输入的数据是否合法。如果校验失败，我们可以在提交表单前阻止表单的提交，并显示错误提示信息。同时，我们还定义了 `errors` 对象来保存校验错误信息，以便在模板中动态显示错误提示信息。