Skip to content

PrimeInputMask

A FormKit wrapper for PrimeVue's InputMask component.

Live Example on Website

Usage

vue
<FormKit type="primeinputmask" v-model="value" mask="99-999999" />

Object-based Example

vue
<script setup>
const schema = [
  { $formkit: 'primeInputMask', name: 'myInputMask', label: 'Input Mask', validation: 'required', validationVisibility: 'live', mask: '99-999999', placeholder: '##-######' },
  { $formkit: 'primeInputMask', name: 'custom', label: 'Input Mask', mask: '(999) 999-9999', iconPrefix: 'pi pi-check', iconSuffix: 'pi pi-check' },
  { $formkit: 'primeInputMask', name: 'phone', label: 'Phone', mask: '+1 (999) 999-9999', placeholder: '+1 (###) ###-####', validation: 'required', validationVisibility: 'live' },
]
const data = {}
</script>

<template>
  <FormKit :schema="schema" :data="data" />
</template>

Props

NameTypeDescription
maskstringInput mask pattern
slotCharstringSlot character
autoClearbooleanAuto clear input
unmaskbooleanReturn unmasked value
ptobjectPass-through options
ptOptionsobjectPass-through options
unstyledbooleanDisable default styles
invalidbooleanMark as invalid
variantstringVisual variant
sizestringInput size

See PrimeVue InputMask docs for more details.

FormKit PrimeVue Module