inertia 🚀
vuejs 🚀
Quick Vuejs Phone formatter

Very very simple

make a component






Make a Service file

export function phone(phone) {
    let x = phone.replace(/\D/g, '').match(/(\d{0,3})(\d{0,3})(\d{0,4})/);
    phone = !x[2] ? x[1] : '(' + x[1] + ') ' + x[2] + (x[3] ? '-' + x[3] : '');
    return phone;
}

Use it in a form

<div class="col-span-6 sm:col-span-4">
  <InputLabel for="phone" value="Phone (optional)" />
  <PhoneComponent v-model="form.phone">
  </PhoneComponent>
  <InputError :message="form.errors.phone" class="mt-2" />
</div>