一、概述
ElementUI 官方给的demo,里面有验证数字的,但是没有小数点的校验。
二、代码实现
页面效果
from表单
代码语言:javascript复制<el-form-item label="价格" prop="price">
<el-input v-model="ruleForm.price" oninput="value=value.replace(/[^0-9.]/g,'')" placeholder="请输入价格" />
</el-form-item>
校验规则
代码语言:javascript复制data() {
const validateMoney = (rule,value,callback) =>{
if(!value){
callback(new Error('价格不能为空'))
}else if(value.indexOf(".") != -1 && value.split('.').length > 2){
callback(new Error('请输入正确格式的金额')) //防止输入多个小数点
}else if(value.indexOf(".") != -1 && value.split('.')[1].length > 2){
callback(new Error('请输入正确的小数位数')) //小数点后两位
}else{
callback();
}
};
return{
rules: {
price:[
{ type: 'string',required: true,trigger: 'blur', validator:validateMoney},
]
},
}
}
本文参考链接: https://www.freesion.com/article/9003774056/