This component uses the libphonenumber-js and the country-codes-list packages to detect and validate the phone input value.
Ready to use phone input component with country code dropdown, with validation and formatting.
The component provides a country dropdown to select the country code, you can use the country
prop to set the default country, otherwise it will be detected from the user's input.
You can use the v-model:country
notation to get the selected/detected country code.
By default, the input value will be formatted in the international format, you can change this behavior with the format
prop to change it to national
.
The component provides a @validation
event to indicate if the input value is valid or not