The Mask input for Vue.js

A lightweight (2KB gzipped) and dependency free mask input created specific for Vue 3

loading...

Install

  
    yarn add vue-the-mask
      or
    npm i -S vue-the-mask
  
        

Usage

  
    // Global
    import { createApp } from 'vue';
    import VueTheMask from 'vue-the-mask';

    const app = createApp({});
    app.use(VueTheMask)

    // Local Component
    import {TheMask} from 'vue-the-mask'
    export default {
      components: {TheMask}
    }

    // Local Directive
    import {mask} from 'vue-the-mask'
    export default {
      directives: {mask}
    }
  
        

Properties

PropertyRequiredTypeDefaultDescription
valuefalseStringInput value or v-model
masktrueString, ArrayMask pattern
maskedfalseBooleanfalseemit value with mask chars, default is raw
placeholderfalseStringSame as html input
typefalseString'text'Input type (email, tel, number, ...)
tokensfalseObjecttokensCustom tokens for mask