身份证效验规则--vue

JS代码

/**
 *校验规则存放
 */
const telephoneValidate = (rule, phoneNo, callback) => {
  const regPhoneNo = /^1[3|4|5|7|8][0-9]\d{8}$/
  if(!phoneNo) {
    callback(new Error('请输入电话号码'))
  }else if(!regPhoneNo.test(phoneNo)) {
    callback(new Error('请输入正确的11位手机号码'))
  }else{
    callback()
  }

}
// 身份证号码校验
const IDCardValidate = (rule, IDCard, callback) => {
  // 15位和18位身份证号码的正则表达式
  const regIDCard = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/
  // 如果通过该验证，说明身份证格式正确，但准确性还需计算
  if (regIDCard.test(IDCard)) {
    if (IDCard.length === 18) {
      const IDCardWi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]// 将前17位加权因子保存在数组里
      const idCardY = [1, 0, 10, 9, 8, 7, 6, 5, 4, 3, 2] // 这是除以11后，可能产生的11位余数、验证码，也保存成数组
      let idCardWiSum = 0 // 用来保存前17位各自乖以加权因子后的总和
      for (let i = 0; i < 17; i++) {
        idCardWiSum += IDCard.substring(i, i + 1) * IDCardWi[i]
      }
      const idCardMod = idCardWiSum % 11 // 计算出校验码所在数组的位置
      const idCardLast = IDCard.substring(17) // 得到最后一位身份证号码
      // 如果等于2，则说明校验码是10，身份证号码最后一位应该是X
      if (idCardMod === 2) {
        if (idCardLast === 'X' || idCardLast === 'x') {
          callback()
        } else {
          console.log(Number(idCardLast), idCardY[idCardMod])
          callback(new Error('身份证号码错误！'))
        }
      } else {
        // 用计算出的验证码与最后一位身份证号码匹配，如果一致，说明通过，否则是无效的身份证号码
        if (Number(idCardLast) === idCardY[idCardMod]) {
          callback()
        } else {
          console.log(Number(idCardLast), idCardY[idCardMod])
          callback(new Error('身份证号码错误！'))
        }
      }
    }
  } else {
    callback(new Error('身份证格式不正确'))
  }
}

export {
  IDCardValidate,
  telephoneValidate
}

引入JS文件

import { IDCardValidate } from "@/utils/validateRules";

语法

1.在data里声明效验规则

data (){
	return {
		addLq:{
			idNo:""
		}
		receiveRules:{
			  idNo: [
          {
            required: true,
            triger: "blur",
            validator: IDCardValidate
          }
        ],
		}
	}
}

2.在template里绑定

<el-form
		//绑定ref为了做提交表单规则效验
        ref="addLq"
        //绑定data里的效验规则
        :rules="receiveRules"
        //绑定表单里的数组
        :model="addLq"
        //左边字段长度
        label-width="100px"
      >
      //绑定prop才会生效
  <el-form-item label="证件号码" prop="idNo" class="ibw40">
          <el-input
            class="ipt"
            v-model="addLq.idNo"
            placeholder="请输入证件号码"
          ></el-input>
  </el-form-item>
<el-form>