vue el-input输入框事件 输入框输入后触发(输入身份证号码，自动产生出生日期) 输入框回车后触发(验证身份证号是否合法)

el-input输入框事件

input change focus blur

<el-form-item label="证件号码" prop="idCard">
  <el-input v-model="form.idCard" style="width:200px" clearable size="small" @input="handleIdCardInput($event)" @change="handleIdCardChange($event)" />
</el-form-item>

输入框输入后触发(输入身份证号码，自动产生出生日期) 

// 输入框输入后触发(输入身份证号码，自动产生出生日期)
handleIdCardInput(idCard) {
  if (this.form.idCardType === '身份证') {
    // 自动产生出生日期
    if (idCard.length >= 14) {
      const bornStr = idCard.substr(6, 4) + '-' + idCard.substr(10, 2) + '-' + idCard.substr(12, 2)
      this.form.birthday = bornStr
    }

    // 自动判定性别
    if (idCard.length >= 17) {
      const sexStr = idCard.substr(16, 1)
      const sexInt = parseInt(sexStr)
      if (sexInt % 2 === 0) { // 女
        this.form.sex = 2
      } else { // 男
        this.form.sex = 1
      }
    }
  }
}

输入框回车后触发(验证身份证号是否合法) 

// 输入框回车后触发(验证身份证号是否合法)
handleIdCardChange(idCard) {
  if (this.form.idCardType === '身份证') {
    var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/
    if (reg.test(idCard) === false) {
      this.msgError('身份证号输入不合法')
    }
  }
}