iview组件库的input框type设置为number时maxlength失效
业务场景为字段只能输入数字,并且最大输入8位。
用了iview的input框,type设置为number,maxlength设置为8
发现并没有限制输入位数,看了下官网当type为number时,maxlength会失效,于是查阅了一下网上的方法,经实践,有效方法如下:
在input组件的on-change方法中判断长度,超过长度用slice方法切割
你以为结束了吗,其实没有!
字段已经切割了,以为可以了,但是发现输入框看起来还是没限制,此时需要刷新视图。
为什么会出现这样的问题
input组件的 onchange方法应该是微任务,不会刷新视图,所以要用vue的nextTick方法刷新视图