VueCraft NPM

Маски ввода ​

Маски форматируют пользовательский ввод в реальном времени. Применяются автоматически в FormRenderer; также доступны автономно.

Пресеты ​

phone-ru ​

+7 (916) 123-45-67

phone-eu ​

+49 (30) 123-45-67

date ​

01.01.2024

inn ​

123456789012

iban ​

GB29 NWBK 6016 1331 9268 19

ts
{ type: 'text', name: 'phone', mask: { preset: 'phone-ru' } }

Кастомные паттерны ​

# = цифра, A = буква (в верхнем регистре), всё остальное = литерал.

ts
{ type: 'text', name: 'postcode', mask: { pattern: 'AA####' } }  // AB1234

Автономный API ​

ts
import { applyMask, removeMask, bindMask } from '@macrulez/vue-form-schema'

applyMask('9161234567', { preset: 'phone-ru' }) // '+7 (916) 123-45-67'
removeMask('+7 (916) 123-45-67', { preset: 'phone-ru' }) // '9161234567'

const cleanup = bindMask(inputEl, { preset: 'date' })
onUnmounted(cleanup)