如何通过Web App（ReactJS）检测Android设备虚拟键盘中的空格键

Posted 2023-04-15

【中文标题】如何通过Web App（ReactJS）检测Android设备虚拟键盘中的空格键

【英文标题】：How to detect sapce key in Android device virtual Keypad through Web App (ReactJS)

【发布时间】：2020-04-21 01:26:58

【问题描述】：

我正在 ReactJS 中构建一个 Web 应用程序，我想在用户点击空格键后调用 API。 我已经尝试了几个事件，例如（onKeyPress，onKeyUp，onKeyDown），但是除了“enter”和“backspace”之外，每个按键都得到了相同的键码。它在台式机上运行良好，但在移动设备上却不行。我该怎么办？ 提前致谢。

【问题讨论】：

我想您使用的是输入法。如果是这样的话;你有没有尝试过使用 onChange 事件来判断新添加的字符是否为空格？

是的，我正在使用输入，考虑到应用程序的性能，使用正则表达式检查每个字符有点复杂

【参考方案1】：

如果只在输入的末尾捕获一个空格就足够了，您可以这样做。

import React,  useState  from "react";

export default () => 
  const onInputChange = (
    target:  value 
  ): void => 
    if (value && value[value.length - 1] === " ") 
      // do stuff
    
  ;

  return <input onChange=onInputChange />;
;