elementUI的form表单,我想去效验身份证的多种证件,该如何写才能根据证件类型进行证件号的效验?
就是,当我选择了香港证件,会去rule效验是不是香港身份证,每种证件我都会去效验。怎么统一的写?
试过这种的,但是没有用,不会去效验上。有没有会的友友帮助一下
elementUI的form表单,我想去效验身份证的多种证件,该如何写才能根据证件类型进行证件号的效验?
<template>
<div>
<el-form
:model="addData"
:rules="rules"
label-width="120px"
style="text-align: left; margin-top: 2%"
>
<el-form-item label="选择证件:">
<el-select
v-model="addData.value"
placeholder="请选择"
@change="changValue"
>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="证件号码:" prop="num">
<el-input v-model="addData.num" placeholder="请输入内容"></el-input>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: "Test",
data() {
return {
addData: {
value: "",
num: "",
},
options: [
{
value: 1,
label: "居民身份证",
},
{
value: 2,
label: "香港身份证",
},
],
rules: {
num: [
{
required: true,
message: "请输入证件号",
},
],
},
};
},
methods: {
changValue() {
switch (this.addData.value) {
case 1:
this.rules.num = [
{
required: true,
pattern:
/^[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{3}([0-9]|X)$/,
message: "请输入正确的身份证",
trigger: "blur",
},
];
console.log(this.rules.num);
break;
case 2:
this.rules.num = [
{
required: true,
pattern: /^[A-Z]{1,2}[0-9]{6,10}[0-9A-Z]$/,
message: "请输入正确的香港身份证",
trigger: "blur",
},
];
console.log(this.rules.num);
break;
default:
break;
}
},
},
};
</script>