Element-ui input 输入框限制只能输入数字的问题

本文探讨了在Element-UI框架中,如何使el-input组件仅接受数字输入,解决了maxLength属性无效、允许输入'e'及重复数字的问题。通过自定义事件处理器,实现了严格的数字输入限制。

需求说明

后台管理系统,使用element-ui el-input组件,要求只能输入数字,最先使用的办法:


 
  1. <el-input

  2. v-model.number='count'

  3. type='number'

  4. maxLength='9'

  5. />

  6. 复制代码

存在的问题


 
  1. 1. maxLength不生效

  2. 2. 可以输入e

  3. 3. 可以输入1.1.....11...1

  4. 复制代码

目前解决的办法(可以生效)


 
  1. <el-input

  2. v-model='count'

  3. oninput="value=value.replace(/[^\d]/g,'')"

  4. maxLength='9'

  5. />

  6. 复制代码

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值