Simple input mask lib for vue.js based on PureMask.js
This version requires Vue 2.X. If you are looking for Vue 1.X, check it here.
npm install v-mask
ES2015
import Vue from 'vue'
// As a plugin
import VueMask from 'v-mask'
Vue.use(VueMask);
// As a directive
import { VueMaskDirective } from 'v-mask'
Vue.directive('mask', VueMaskDirective);UMD
<script src="vue.min.js"></script>
<script src="v-mask.min.js"></script>
<script>
// As a plugin
Vue.use(VueMask.VueMaskPlugin);
// As a directive
Vue.directive('mask', VueMask.VueMaskDirective);
</script><input type="text" v-mask="'####-##'" v-model="myInputModel">
<!-- OR -->
<input type="text" v-mask="'##/##/#### ##:##'" v-model="myInputModel">Notice: v-model is required starting from v1.1.0, because a lot of bugs with HTMLElement event listeners and sync with Vue internals.
There is no reason to support using this lib for using without v-model but open the door for using on custom inputs.
List of supported placeholders:
| Value | Format |
|---|---|
| # | Number (0-9) |
| A | Letter in any case (a-z,A-Z) |
| N | Number or letter |
| X | Any symbol |
| ? | Optional (next character) |
Jest is used for unit-tests.
You can run tests by typing this command in your console:
npm testNightwatch is used of E2E testing.
Check the v-mask--demo repo for more details
PR is welcome!
Notice: You should make your changes only in src folder, don't try to edit files from dist as it compiled from src by babel and shouldn't be changes manually.