Press "Enter" to skip to content

Javascript Regular Expression RegExp Length Limit In Vue.js 3

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

ParameterTypeDefaultRequiredDescription
regExpRegExpnullfalseUsing for: String.prototype.replace(regexp, replacement)
replacementStringfalseUsing for: String.prototype.replace(regexp, replacement)
v-model[.number]String/Number trueUsing for getting input value

Commonly used regExp

regExpDescription
/^[0\D]*|\D*/gpositive integer
/[^a-z]/glowercase
/[^A-Z]/guppercase
/[^\w]/g\ w, Equivalent to [A-Za-z0-9_]
/[^\u4e00-\u9fa5]/gChinese

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

    Leave a Reply

    Your email address will not be published. Required fields are marked *