OrionPhone

<o-phone> affiche un champ de saisie de numéro de téléphone.

Le numéro sera formatté en fonction du pays sélectionné.

Usage

PhoneMobile PhoneFlag

Pays préférés

Vous pouvez, en utilisant une référence vue sur orion phone, accèder à l'instance de l'orion select _countrypour pouvoir renseigner vos pays favoris.

Pour ajouter vos pays favoris, vous devez utiliser le type Orion.Country. Vous pourrez trouver la liste des pays ici et ainsi obtenir l'objet Orion complet.

PhonePlayground

VModels

Name
vModelVModelType = undefined
phoneCountryCodestring | undefined = undefined
phoneNumberstring | undefined = undefined

Props

Name
autofocusboolean = undefined
clearableboolean = undefined
clearToNullboolean = undefined
disabledboolean = undefined
donetypingnumber = undefined
flagboolean = undefined
forceLabelFloatingboolean = undefined
inheritValidationStateboolean = undefined
labelstring = undefined
mobileboolean = undefined
placeholderstring = undefined
prefixFontIconstring = undefined
prefixIconOrion.Icon = undefined
readonlyboolean = undefined
requiredboolean = undefined
selectOnFocusboolean = undefined
sizeOrion.Size = 'md'
suffixFontIconstring = undefined
suffixIconOrion.Icon = undefined
typeany = 'tel'
validationany = undefined
validationErrorMessagestring = undefined

PublicInstance

Name
Type
isValidMobile
() => boolean
_country
() => { getSearchTerm: () => string | undefined; setSearchTerm: (val?: string) => string | undefined; setFavoritesOptions: (val: unknown[]) => unknown[]; triggerSearchAsync: (term?: string) => Promise<void>; blur: import("lodash").DebouncedFuncLeading<(e?: FocusEvent, selection?: boolean) => false | undefined>; hasBeenFocus: () => boolean; isFocus: () => boolean; focus: () => void; clear: () => void; setHasBeenFocus: (value: boolean) => void; isValid: () => boolean; _input: () => HTMLInputElement | undefined; sharedState: () => { hasBeenFocus: boolean; isFocus: boolean; isAutoFilled: boolean; }; } | undefined
_orionInput
() => (HTMLInputElement & { valueDisplay: () => string; hasBeenFocus: () => boolean; isFocus: () => boolean; focus: () => void; blur: import("lodash").DebouncedFuncLeading<() => void>; clear: () => void; setHasBeenFocus: (value: boolean) => void; isValid: () => boolean; _input: () => HTMLInputElement | undefined; sharedState: () => { hasBeenFocus: boolean; isFocus: boolean; isAutoFilled: boolean; }; }) | undefined
hasBeenFocus
() => boolean
isFocus
() => boolean
focus
() => void
blur
Lodash.debounce
clear
() => void
setHasBeenFocus
(value: boolean) => void
isValid
() => boolean
_input
() => HTMLInputElement | undefined
sharedState
() => { hasBeenFocus: boolean; isFocus: boolean; isAutoFilled: boolean; }