Pattern input is a component of Vue that uses RegExp to restrict user input. It works like the original input element, you can add maxlength class attributes. You can use v-form as well.
vue js limit input characters, regular expression length limit javascript, regex limit number of digits, javascript, regex less than 10 characters, vue regex input pattern
How to make use of it:
Install & Download:
$ npm install vue-pattern-input
<pattern-input class="your-class-name" :regExp="setting.regExp" :replacement="setting.replacement" @input="handleInput" @change="handleChange" v-model.number="setting.val"></pattern-input>
setting: { regExp: /^[0\D]*|\D*/g, // Match any character that doesn't belong to the positive integer replacement: '', val: '223' }
Parameter declaration
Parameter | Type | Default | Required | Description |
---|---|---|---|---|
regExp | RegExp | null | false | Using for: String.prototype.replace(regexp, replacement) |
replacement | String | ” | false | Using for: String.prototype.replace(regexp, replacement) |
v-model[.number] | String/Number | Â | true | Using for getting input value |
Commonly used regExp
regExp | Description |
---|---|
/^[0\D]*|\D*/g | positive integer |
/[^a-z]/g | lowercase |
/[^A-Z]/g | uppercase |
/[^\w]/g | \ w, Equivalent to [A-Za-z0-9_] |
/[^\u4e00-\u9fa5]/g | Chinese |
Use RegExp To Limit Input, vue pattern input Plugin/Github, regex no numbers or special characters, validate input regex
See Demo And Download
Official Website(RoamIn): Click Here
This superior jQuery/javascript plugin is developed by RoamIn. For extra Advanced Usages, please go to the official website.
Be First to Comment