<template>
  <div>
    <label for="idNumber">身份证号码:</label>
    <input type="text" id="idNumber" v-model="idNumber">
    <button @click="checkIdNumber">验证</button>
    <p v-if="errorCount === 3">您已连续三次输入错误,不能再次尝试验证。</p>
    <p v-else-if="isValid">验证通过。</p>
    <p v-else>请再次输入。</p>
  </div>
</template>
<script>
export default {
  data() {
    return {
      idNumber: '',
      errorCount: 0
    }
  },
  computed: {
    isValid() {
      // 验证身份证号码的正则表达式
      const reg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|(3[0-1]))\d{3}[0-9X]$/;
      return reg.test(this.idNumber);
    }
  },
  methods: {
    checkIdNumber() {
      if (this.isValid) {
        alert('验证通过。');
      } else {
        this.errorCount++;
      }
    }
  }
}
</script>

原文地址: https://www.cveoy.top/t/topic/b0TW 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录