<el-input v-model="scope.row.PRICE" placeholder="请输入价格" oninput="value=value.replace(/^(0|[1-9]\d*)(\.\d{1,2})?$/)" maxLength="7" ></el-input>写法对嘛?正则
时间: 2023-11-13 11:05:04 浏览: 81
这个写法是有一些问题的。
首先,`oninput` 事件应该绑定一个 JavaScript 函数,而不是直接写一个字符串。
其次,`value=value.replace(/^(0|[1-9]\d*)(\.\d{1,2})?$/)` 这段代码中的正则表达式是正确的,可以用来限制只能输入小于1的正数且小数点后只能有两位。但是,在使用这个正则表达式替换输入框中的值时,如果用户输入的值不符合正则表达式,则会被替换为空字符串,这会导致输入框中的值被清空,用户无法输入有效的值。
因此,一个更好的写法是在 `oninput` 事件中调用一个 JavaScript 函数,这个函数可以接受输入框中的值,使用正则表达式验证是否符合要求,如果符合要求,则将值赋给 `v-model` 绑定的属性,否则不做任何操作。下面是一个示例代码:
```html
<el-input v-model="scope.row.PRICE" placeholder="请输入价格" @input="handleInput"></el-input>
```
```javascript
methods: {
handleInput(val) {
const reg = /^(0|[1-9]\d*)(\.\d{1,2})?$/
if (reg.test(val)) {
this.scope.row.PRICE = val
}
}
}
```
这个示例代码中,`handleInput` 函数接受输入框中的值作为参数 `val`,然后使用正则表达式 `reg` 验证这个值是否符合要求。如果符合要求,则将这个值赋给 `v-model` 绑定的属性 `scope.row.PRICE`,否则不做任何操作。这样就可以在不清空输入框中的值的情况下限制输入的内容了。
阅读全文