Vue项目中身份证号的验证及根据身份证号来自动识别年龄、性别、出生日期

程序小迷糊

已于 2024-02-25 21:44:31 修改

阅读量1.6k

点赞数 8

分类专栏： Vue 文章标签： vue

于 2024-02-25 19:28:15 首次发布

本文链接：https://blog.csdn.net/weixin_51730253/article/details/136285967

版权

Vue 专栏收录该内容

1 篇文章

订阅专栏

本文描述了作者在毕业设计中使用ElementUI的el-form组件实现用户输入身份证号码后自动填充出生日期、性别和计算年龄的过程，同时包含数据验证规则。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

#毕业设计

完成毕业过程中的随手小记，对自己的要求只为实现此功能，路子野,不足之处还请各位大佬斧正

一、form表单中代码如下

<el-form :inline="true" :model="form" label-width="100px" ref="form" :rules="formRules">  
  <el-form-item label="证件号码" prop="idcard">
    <el-input v-model="form.idcard"  
        placeholder="请输入身份证号"
        @input="getByIdcard(form.idcard)" />
  </el-form-item>
  <el-form-item label="年龄" prop="age" >
    <el-input v-model="form.age" placeholder="请输入年龄" disabled></el-input>
  </el-form-item><br>
  <el-form-item label="性别" prop="sex" >
    <el-input v-model="form.sex" placeholder="请输入性别" disabled></el-input>
  </el-form-item><br>
  <el-form-item label="出生日期" prop="birth" >
    <el-input v-model="form.birth" placeholder="请输入出生日期" disabled></el-input>
  </el-form-item>
</el-form>

二、在data方法中的代码如下

data() {
   return {
        form:{
           name:''
        },

        value: '',

        formRules: {
           idcard: [
            { required: true, message: '请填写证件号码', trigger: 'blur' },//证件号码校验
             {
            pattern: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
            message: '证件号码格式有误！',
            trigger: 'blur'
          }
        ],
      }
   }
}

三、在methods中的代码如下

methods:{
getByIdcard(IdNO) {
      let birthday = "";
      let time = '';
      let sex = '';
      let age = '';
      let myDate = new Date()
         //根据身份证号码获取出生年月
      if (IdNO.length == 18) {
        birthday = IdNO.substr(6, 8);
        time = birthday.replace(/(.{4})(.{2})/, "$1-$2-");
        this.form.birth = time
      }
      //根据身份证号码获取性别
      if (IdNO.length == 18) {
        sex = IdNO.substr(16,1);
        if(sex% 2 == 1){
        this.form.sex = '男'
         } else {
        this.form.sex = '女'
        }
        }
      //根据身份证号码获取年龄
       if(IdNO.length == 18){
        age = myDate.getFullYear() - IdNO.substring(6, 10) - 1;
        this.form.age = age;
       }
    },
}