[Vuejs]-How can I bind saved phone number to vue tel input for the purpose of editing

by

1👍

To bind the saved phone number to the vue-tel-input for the purpose of editing, you can use the value prop provided by the vue-tel-input component.

First make sure that the saved phone number is stored in a property of your Vue component, such as client. ClientPhone.

<template>
  <div>
     <vue-tel-input v-model="client.ClientPhone" v-bind="bindPropsUserInfo" :value="client.ClientPhone"></vue-tel-input>
  </div>
</template>

This will bind the saved phone number to the vue-tel-input, and the vue-tel-input will automatically format the phone number based on the mode prop. In this case, the phone number will be formatted as an international phone number.

If you want to prevent the vue-tel-input from overwriting the saved phone number with the country code, you can set the autoFormat prop to false. This will disable automatic formatting of the phone number, and the vue-tel-input will display the saved phone number as it is.

<template>
  <div>
     <vue-tel-input v-model="client.ClientPhone" v-bind="bindPropsUserInfo" :value="client.ClientPhone" :autoFormat="false"></vue-tel-input>
  </div>
</template>
👤user18643652

Leave a comment