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

Property Required Type Default Description
value false String Input value or v-model
mask true String, Array Mask pattern
masked false Boolean false emit value with mask chars, default is raw
placeholder false String Same as html input
type false String 'text' Input type (email, tel, number, ...)
tokens false Object tokens Custom tokens for mask