在使用 Element UI（一个常见的 Vue UI 组件库），要给 添加表单验证，Element UI 的表单验证通常通过 Form 和 FormItem 组件以及它们的 rules 属性来实现。下面是一个例子，展示如何给联系人字段添加表单验证：

首先， Vue 组件中有一个 Form 组件，定义验证规则：

<template>  
  <el-form :model="formData" :rules="rules" ref="form" label-width="120px">  
    <el-form-item label="联系人" prop="user.lxr">  
      <el-input v-model="formData.user.lxr" maxlength="32" placeholder="请输入联系人"></el-input>  
    </el-form-item>  
    <!-- 其他表单项... -->  
    <el-form-item>  
      <el-button type="primary" @click="submitForm('form')">提交</el-button>  
      <el-button @click="resetForm('form')">重置</el-button>  
    </el-form-item>  
  </el-form>  
</template>  
  
<script>  
export default {  
  data() {  
    return {  
      formData: {  
        user: {  
          lxr: '', // 联系人姓名  
          // 其他字段...  
        },  
        // 其他表单数据...  
      },  
      rules: {  
        'user.lxr': [  
          { required: true, message: '请输入联系人姓名', trigger: 'blur' },  
          { max: 32, message: '联系人姓名最多10位', trigger: 'blur' }  
        ],  
        // 其他验证规则...  
      },  
    };  
  },  
  methods: {  
    submitForm(formName) {  
      this.$refs[formName].validate((valid) => {  
        if (valid) {  
          alert('提交成功!');  
          // 这里可以添加你的表单提交逻辑  
        } else {  
          console.log('error submit!!');  
          return false;  
        }  
      });  
    },  
    resetForm(formName) {  
      this.$refs[formName].resetFields();  
    },  
  },  
};  
</script>

在这个例子中，我使用了 el-form 和 el-form-item 组件来构建表单。我通过 :model 绑定 formData 对象，并通过 :rules 绑定 rules 对象来定义验证规则。每个 el-form-item 通过 prop 属性来指定它对应的表单项的数据属性（这里是 user.lxr）。

当用户尝试提交表单时，submitForm 方法会被调用，它会触发 el-form 的验证过程。如果验证通过，表单将被提交；否则，会显示相应的错误信息。