vue + elementUI 表单验证——身份证，手机号

话不多说，直接贴代码

<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="身份证" prop="idNumber">
<el-input v-model="form.idNumber" style="width: 370px;" />
</el-form-item>
<el-form-item label="手机号" prop="loginId">
<el-input v-model="form.loginId" style="width: 370px;" />
</el-form-item>
</el-form>

import idNumber from '@/assets/json/idNumber'

data() {
const rulesIdNumber = (rule, value, callback) => {
if (idNumber.cnid(value) === false) {
callback('身份证信息错误')
} else {
callback()
}
}
const rulesloginId = (rule, value, callback) => {
if (!/^1[34578]\d{9}$/.test(value)) {
callback('手机号信息有误')
} else {
callback()
}
}
return {
rules: {
idNumber: [
{ required: true, message: '身份证不能为空', trigger: 'blur' },
{ validator: rulesIdNumber, trigger: 'blur' }
],
loginId: [
{ required: true, message: '手机号不能为空', trigger: 'blur' },
{ validator: rulesloginId, trigger: 'blur' }
]
}
}
},

身份证验证的js文件地址：
https://hakupload.oss-cn-beijing.aliyuncs.com/Mabatis-plus/json/idNumber