一、只能输入数字,限制三字符
- 限制三字符:
maxLength="3"
- 只能输入数字,需要绑定一个方法,用正则表达式校验:
@input="valueChange('stuNum')"
stuNum是我要的参数名,方法怎么写看下面完整的script代码。
- 完整的html代码如下:
<input
type="text"
maxLength="3"
v-model="StudentForm.stuNum"
rules="rules"
ref="person"
placeholder="请输入人数"
:readonly="readonly"
@input="valueChange('stuNum')"
/>
- 完整的script代码如下:
valueChange(type){
if(type == "stuNum"){
this.StudentForm.stuNum = this.StudentForm.stuNum.replace(/\D/g,'')
}
},
二、输入字符不限,限制保留小数点后两位
- 由于输入字符不限制,就不需要设置maxlength
- 限制保留小数点后两位,需要绑定一个方法:
@input="valueChange('money')
money是我需要获取的参数名
方法具体怎么写,看下面的完整script。
- 完整的html:
<input
type="number" @input="valueChange('money')"
v-model="StudentForm.money"
rules="rules"
placeholder="请精确到小数点后两位"
:readonly="readonly"
/>
- 完整的script:
valueChange(type){
if(type == "money"){
this.StudentForm.money = this.StudentForm.money.match(/\d{1,}(\.\d{1,2})?/g)[0]
}
},
该正则表达式的意思就是只取第一个数组(我自己的理解哈,可能不全面)