antd 验证 动态 required_VUE表单验证/添加超链接列

:rules="rules" 是动态绑定的rules，表单验证规则

form表单

<template>
    <div class="short-visit">
      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="130px" class="demo-ruleForm" v-if="textFlag">
        <el-form-item label="姓名" prop="name" class="form-height">
          <el-input
            v-model="ruleForm.name"
            :class="nameClass? '':'active'"
            :disabled="nameShell"
            @focus="nameFocus"
            maxlength="30"
          ></el-input>
        </el-form-item>
        <el-form-item class="submitBtn">
          <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
        </el-form-item>
      </el-form >
      </div>
    </div>
</template>

验证规则

 data (){
    return {
      ruleForm: {   // 存放数据的对象
        name: '', // 姓名
      },
      rules: { // 就是我们在el-form中绑定的rules，进行表单的验证
        name: [ // 我们在el-form-item中绑定的prop，就是这里的name，需要大家注意，这具有唯一性
          { required: true, message: '请输入姓名', trigger: 'blur' }  // require:是否必填，如不设置，则会根据校验规则自动生成;message:是提示的内容；trigger：是什么事件触发
        ]
      }
    }
  },

---

<el-table-column label="数据" show-overflow-tooltip align="center" min-width="150">
  <template slot-scope="scope">
    <div @click="invoicesLink(scope.row)" class="lookProcess">{{scope.row.orderNo}}</div>
  </template>
</el-table-column>

效果