vue el-input 只能输入数字且有小数点最多保留两位

只能输入数字且最多两位小数:<el-form-item label="价格" prop="price"><el-input v-model="materialTSCLForm.price" onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"&gt

新老农

3290人浏览 · 2022-04-29 17:13:03

新老农 · 2022-04-29 17:13:03 发布

只能输入数字且最多两位小数:

<el-form-item label="价格" prop="price">
     <el-input v-model="materialTSCLForm.price" onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/);this.dispatchEvent(new Event('input'))"></el-input>
</el-form-item>

在标签里用原生事件onkeyup写一句代码就行。

如：只能输入数字或字母

οnkeyup=“this.value=this.value.replace(/[\W]/g,‘’);this.dispatchEvent(new Event(‘input’))”
但是这里有个坑！
vue的v-model是监听input框的input事件生效的。

而通过value直接操作dom元素，vue的v-model是监听不到的！

所以要手动分发一个input事件使v-model监听到。

this.dispatchEvent(new Event(‘input’))

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^