@pderas/vue2-chars

Vue Chars

A vue.js plugin that gets takes a string of tokens and produces that many single input boxes. The value, however, will be one connected string (e.i. Not a bunch of single characters seperated)

How to initialize Vue Chars

Vue chars is built as a vue plugin to allow for use throughout the application.

import Chars from "@pderas/vue2-chars";

Vue.use(Chars);

Usage

Creation

Vue chars is easily created, but at mininum requires a mask. Having said that, Vue chars works best with v-model.

<chars mask="####" v-model="myVar"></chars>

Properties

Property	Required	Type	Default	Description
mask	true	Number	n/a	The mask for the input
value	false	Number|String	0	Value for the input, can be used with v-model

Masks

Mask	Description
#	Number character only
X	Alphanumeric character only
S	Alphabetic character only
A	Alphabetic character only (will convert to uppercase)
a	Alphabetic character only (will conver to lowercase)

License

This project is covered under the MIT License. Feel free to use it wherever you like.