Masked Input Vue Component

Masked Input Vue Component

An input mask component for Vue.js, based on the inputmask-core library.


npm npm CircleCI

A Vue component for <input> masking, built on top of inputmask-core.



yarn add vue-maskedinput

CDN: UNPKG | jsDelivr (available as window.MaskedInput)


  <masked-input pattern="11/1111" placeholder="11/1111"></masked-input>

import MaskedInput from 'vue-maskedinput'

export default {
  components: {


mask : string

The masking pattern to be applied to the <input>.

formatCharacters: Object

Customised format character definitions for use in the pattern.

placeholderChar: string

Customised placeholder character used to fill in editable parts of the pattern.

placeholder : string

A default placeholder will be generated from the mask's pattern, but you can pass a placeholder prop to provide your own.

value : string

A default value for the mask.

hideUnderline : Boolean

A boolean to hide placeholder's underline

See the inputmask-core docs for details.


MIT © luyilin

Github Repository

Tags: #VueJs