Input 🔗
Поле для пользовательского ввода
Пример использования:
Оставьте свои контактные данные:
Введённое имя:
Введённый email:
Введённый номер телефона:
Исходный код для примера выше:
<script>
let firstname = ''
let email = ''
let phone = ''
let phoneMask = {
mask: '+{7} (000) 000-00-00'
}
</script>
<Grid m={4} s={1}>
<Input wide type="text" placeholder="Имя" bind:value={ firstname } />
<Input wide type="email" placeholder="Email" bind:value={ email } />
<Input wide type="tel" placeholder="Контактный телефон" bind:value={ phone } mask={ phoneMask } />
</Grid>
<Text>Введённое имя: { firstname }</Text>
<Text>Введённый email: { email }</Text>
<Text>Введённый номер телефона: { phone }</Text>Параметры:
wide boolean
Если параметр указан (имеет значение true), компонент будет иметь свойство width: 100%
mask object
Маска для поля ввода (Подробнее: svelte-imask )
id string
Аналог стандартного атрибута id
min number
Аналог стандартного атрибута min
max number
Аналог стандартного атрибута max
name string
Аналог стандартного атрибута name
step number
Аналог стандартного атрибута step
list string
Аналог стандартного атрибута list
value string
Аналог стандартного атрибута value
pattern string
Аналог стандартного атрибута pattern
placeholder string
Аналог стандартного атрибута placeholder
type enum
Аналог стандартного атрибута type
readonly boolean
Аналог стандартного атрибута readonly
Значение по умолчанию: false
multiple boolean
Аналог стандартного атрибута multiple
Значение по умолчанию: false
disabled boolean
Аналог стандартного атрибута disabled
Значение по умолчанию: false
autofocus boolean
Аналог стандартного атрибута autofocus
Значение по умолчанию: false
required boolean
Аналог стандартного атрибута required
node HTMLElement
Параметр для связки с HTML-элементом, который лежит в основе компонента
(аналог стандартного bind:this)
id string
Аналог стандартного атрибута id
className string
Аналог стандартного атрибута class