I am struggling with setting up a Dutch phone number field in a form. Every time I input the first digit as 0, it disappears when I enter the second digit.
A valid Dutch phone number format can be: 06 + 8 digits (0612345678) or 0 + 2 digits (region code) + 7 digits (012 1234567) or 316 + 8 digits (31612345678).
<el-input
v-model.number="form.phoneNumber"
@keypress="isPhoneNumber(form.phoneNumber)"
:placeholder="$t('phonenumber')"
></el-input>
This is the validator being used:
phoneNumber: [
{
required: true,
type: "text",
pattern: "^(?:0|(?:\+|00) ?31 ?06 ? )(?:(?:[1-9] ?(?:[0-9] ?){8})|(?:6 ?-? ?[1-9] ?(?:[0-9] ?){7})|(?:[1,2,3,4,5,7,8,9]\d ?-? ?[1-9] ?(?:[0-9] ?){6})|(?:[1,2,3,4,5,7,8,9]\d{2} ?-? ?[1-9] ?(?:[0-9] ?){5}))$",
message: this.$t("please_fill_a_phonenumber"),
trigger: "blur",
},
],
Do you see anything obvious that I might be missing?