javascript - react .JS : Detect if keyboard input is from a barcode scanner

标签 javascript jquery reactjs barcode-scanner

我正在处理一个问题,我们需要检测用户是否使用条形码扫描器将某些内容扫描到输入框中,或者他们只是使用常规键盘输入值。基于每个场景,我们希望有不同的回调来处理用户输入。

我正在移植一个代码库,该代码库以前使用此库利用 jQuery 检测条码:https://github.com/escaleno-ltda/jQuery-Scanner-Detection .

我现在正在用 React.JS 重写这段代码,但我被困在这里,因为 React.JS 上没有可用的库。

是否可以将该代码导入到我的 React.JS (create-react-app) 项目中? 我做了 yarn install jQuery-Scanner-Detection 并尝试导入它,但我遇到了这个问题: ReferenceError: jQuery 未定义 (这个是在依赖文件里,不是我的项目,我想修改一个依赖应该不会很容易吧。)

另一种方式:是否可以在 React.JS 中原生实现逻辑?它基本上检测用户输入键盘的速度,如果速度足够快,那么我们就认为它是条形码扫描。否则我们将其视为常规击键。

最佳答案

查看那个库,它尝试检查三件事

  • (可选)按下按钮时扫描仪发出的特定键码
  • (可选)扫描仪在条形码末尾发出的字符键码
  • 字符之间的时间

鉴于使用 React,您可以订阅 DOM 事件并实现相同的逻辑,第二个问题的答案是,是的,您可以创建一个 React 组件。

关于javascript - react .JS : Detect if keyboard input is from a barcode scanner,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50943015/

相关文章:

jquery - typeahead.js 预取不起作用

reactjs - React Native-如何在 React Native 中仅显示一次登录屏幕?

reactjs - 组件不会重新渲染,但 redux 状态已通过 React hooks 更改

javascript - 如何映射不同 svg 组件的列表?

javascript - 将 Geolocation API 编写为 Angular 的 Promise 或 Observable

javascript - 隐藏复选框的标签 - Yii2

javascript - 最新包含 Blink 的浏览器(如 Chrome、Opera)中的奇怪滚动行为

javascript - TypeScript:获取位于任意路径上的cookie

javascript - Jquery 复选框选中和取消选中效果不佳

javascript 如何判断一个数字是否是另一个数字的倍数