# Props
allCountries
- Type:
Array
-
Default:
An array of all countries, see
allCountries.js
All countries that are used in libphonenumber-js
, can be overridden by this prop
autoFormat
- Type:
Boolean
-
Default:
true
Auto update the input to the formatted phone number when it's valid
customValidate
- Type:
Boolean
,RegExp
-
Default:
false
Custom validation RegExp for input
defaultCountry
- Type:
String
,Number
-
Default:
''
Default country (by iso2 or dialCode), will override the country fetched from IP address of user
disabled
- Type:
Boolean
-
Default:
false
Disable vue-tel-input
, including the input & flag dropdown
autoDefaultCountry
- Type:
Boolean
-
Default:
true
To fetch default country based on IP address of user
dropdownOptions
- Type:
Object
- Default:
Options for dropdown, see below
dropdownOptions.showDialCodeInList
- Type:
Boolean
-
Default:
true
Show dial code in the dropdown list
dropdownOptions.showDialCodeInSelection
- Type:
Boolean
-
Default:
false
Show dial code in the dropdown selection
dropdownOptions.showFlags
- Type:
Boolean
-
Default:
true
Show flags in the dropdown selection and list
dropdownOptions.tabindex
- Type:
Number
-
Default:
0
Native dropdown tabindex
attribute
ignoredCountries
- Type:
Array
-
Default:
[]
List of countries will NOT be shown on the dropdown
inputOptions
- Type:
Object
- Default:
Options for input, see below
inputOptions.autocomplete
- Type:
String
-
Default:
'on'
Native input autocomplete
attribute
inputOptions.autofocus
- Type:
Boolean
-
Default:
false
Native input autofocus
attribute
inputOptions.id
- Type:
String
-
Default:
''
Native input id
attribute
inputOptions.maxlength
- Type:
Number
-
Default:
25
Native input maxlength
attribute
inputOptions.name
- Type:
String
-
Default:
'telephone'
Native input name
attribute
inputOptions.placeholder
- Type:
String
-
Default:
'Enter a phone number'
Placeholder for the input
inputOptions.readonly
- Type:
Boolean
-
Default:
false
Native input readonly
attribute
inputOptions.required
- Type:
Boolean
-
Default:
false
Native input required
attribute
inputOptions.tabindex
- Type:
Number
-
Default:
0
Native input tabindex
attribute
inputOptions.type
- Type:
String
-
Default:
'tel'
Native input type
attribute
inputOptions.styleClasses
- Type:
String
,Array
,Object
-
Default:
''
Custom classes for the input
invalidMsg
- Type:
String
-
Default:
''
mode
- Type:
String
-
Default:
'auto'
Allowed values: 'auto'
(Default set by phone), 'international'
(Format number with the dial code i.e. + 61), 'national'
(Format number without dial code i.e. 0321232)
onlyCountries
- Type:
Array
-
Default:
[]
List of countries will be shown on the dropdown
preferredCountries
- Type:
Array
-
Default:
[]
Preferred countries list, will be on top of the dropdown
styleClasses
- Type:
String
,Array
,Object
-
Default:
''
Custom classes for the wrapper
validCharactersOnly
- Type:
Boolean
-
Default:
false
Only allow valid characters in a phone number (will also verify in mounted
, so phone number with invalid characters will be shown as an empty string)
← Vue 3 Support Events →