element 验证详解 自定义验证规则

 

如图，验证功能点名称，长度1-20并且是数字和字母的组合。

长度是1-20，这个很好办，直接 el-form表单上添加 :rules="rules" ， 添加个 ref="ruleForm" ，下面提交的时候好识别 ， prop="powerName"  就是对应的规则的名称了

<el-form :model="form" :rules="rules" ref="ruleForm">
  <el-form-item label="功能点名称 *" prop="powerName" :label-width="formLabelWidth">
    <el-input v-model="form.powerName"  type="text"
      placeholder="请填写功能点名称(1-20位,数字或字母或两者的组合)"></el-input>
  <