el-input表单校验只能输入数字
时间: 2023-10-09 21:07:20 浏览: 127
el-input限制输入框只能输入数字
,如何实现?
您可以使用正则表达式来校验输入内容是否为数字。在el-input组件中,设置属性v-model为一个数据变量,然后在该组件上设置属性v-bind:rules为一个数组,数组中包含一个对象,对象中设置validator属性为一个函数,该函数接收两个参数(value,callback),value为用户输入内容,callback为回调函数。在validator函数中,使用正则表达式判断输入内容是否为数字,如果匹配则调用callback(true)表示验证通过,否则调用callback('请输入数字')表示验证失败。例如:
<el-input v-model="inputValue" v-bind:rules="[ { validator: checkNumber, message: '请输入数字' } ]"></el-input>
function checkNumber(value, callback) {
if (/^\d+$/.test(value)) {
callback(true);
} else {
callback('请输入数字');
}
}
阅读全文