How can I format a phone number using Vue.js?

edit

Here's an example of how to format a phone number using Vue.js:

<template>
  <div>
    <input type="text" v-model="phoneNumber" @input="formatPhoneNumber">
  </div>
</template>

<script>
export default {
  data() {
    return {
      phoneNumber: ''
    }
  },
  methods: {
    formatPhoneNumber() {
      // Remove all non-numeric characters
      let cleanedNumber = this.phoneNumber.replace(/\D/g, '');

      // Format the number with dashes
      let formattedNumber = cleanedNumber.slice(0, 3) + '-' + cleanedNumber.slice(3, 6) + '-' + cleanedNumber.slice(6);

      // Set the formatted number back to the model
      this.phoneNumber = formattedNumber;
    }
  }
}
</script>

This example listens for input changes on an input field with v-model and uses the formatPhoneNumber method to remove non-numeric characters and format the number with dashes. The method then sets the formatted number back to the model.