Vue 结合elementUI 的项目,今天处理的bug :输入框限制小数点的特殊输入。问题:正常输入已经限制小数点的输入,但按<回退键>再输入小数点是可以操作的。
刚开始 给<input>标签绑定了@keyup.native="proving($event)"事件。
方法代码如下:
在这里插入图片描述
处理一 :常规输入起效,输入框内容为空,但 鼠标 点击其他地方 输入框的 内容会再显示;处理二:按<回退键>再输入小数点依然可以下一步操作的。

最后,通过自定义表单校验规则进行验证,实现限制。方法如下:
1.添加校验规则,放图:
在这里插入图片描述
2.直接在输入框 的rules添加自定义验证,如图:
在这里插入图片描述
自定义规则中,validator接受的是自定义的新规则,Error为接受的错误提示。
效果如下图:
回退输入小数点
bug算解决了。
如各位 dalao 有好的见解或方法,望多多指点。谢谢。
新增写法:

Logo

前往低代码交流专区

更多推荐