vue input判断值是扫码枪还是键盘输入

2 篇文章 0 订阅
2 篇文章 0 订阅

区分扫描枪输入和键盘输入的实现

首先,在input上绑定keyup事件,注意添加native

如图:

在这里插入图片描述
<el-input class=“clo_input mgtop_20” v-model=“WashingCode” @keyup.native=“inputNum” @change=“inputchange”>

methods中inputNum方法如下:
在这里插入图片描述
新增一个新数组,每次得到的target.timeStamp,是指 当前按键发生时间,而计算前后按键发生时间间隔,超过30一般是指按键,而小于30则证明是扫码枪输入值

if(Math.ceil(this.arr[this.arr.length-1]) - Math.ceil(this.arr[this.arr.length-2])<30)
之所以这样判断,是为了准备起见,不用清空arr数组,拿arr下标最后一个和倒数第二个做对比,这样等同于每次进来新数据都与旧数据进行了一次比较

注意:target.timeStamp不能直接添加(push)进arr数组中,会使数组为空,不能直接用;

写的有问题的话,还请多指教,一起学习。

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue 是一个用于构建用户界面的渐进式 JavaScript 框架,Vue 扫码能够实现无焦点捕获扫码输入。 扫码是一种硬件设备,它能够将二维码或条形码的信息转化为可识别的数据。传统上,为了使用扫码,用户需要将光标聚焦于输入框中,然后才能够将扫码对准二维码或条形码进行扫描。然而,使用 Vue 扫码插件,我们能够实现无焦点捕获扫码输入的功能。 通过在 Vue 组件中使用合适的库或插件,我们可以实现这一功能。这样做的原理是将扫码扫描结果直接传递给指定输入框,而不需要用户手动聚焦于输入框中。 在 Vue 的生命周期钩子中,我们可以监听扫码设备的事件,如 "scan"。当扫码扫描到二维码或条形码时,将触发这个事件。我们可以在这个事件中通过 JavaScript 来处理扫描结果,然后将其赋给指定的输入框。 同时,我们可以借助 Vue 的双向数据绑定功能,实现将扫码扫描结果的动态更新到其他需要使用这个的地方。 需要注意的是,为了确保无焦点捕获扫码输入的功能正常工作,我们需要在 Vue 组件中的对应输入框上添加适当的事件监听器,以便识别到扫码的输入。 总的来说,通过使用 Vue 扫码插件和相关的库或插件,我们可以实现无焦点捕获扫码输入的功能,提高用户的扫码体验和输入效率。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值