React onKeyPress 事件未检测到退格键

Question

我有一个 handleBackspace 函数，可以在按下退格键时执行某些操作。

我试过这个：

const handleBackspace = (e) => {
    if(e.keyCode === 8) {
        console.log('1')
    }
}

//
<input onKeyPress={handleBackspace}>

但这不起作用。（我用 keyCode 13 [enter] 试过了，它起作用了。但是 keyCode 8 [backspace] 不起作用）有人能告诉我一个解决方案吗？

Answer 1

onKeyDown 检测到 keyCode 事件。

尝试将其更改为 onKeyDown 事件。

沙盒：https://codesandbox.io/s/react-basic-class-component-kzv2k?file=/src/index.js

  handleBackspace = e => {
    if (e.keyCode === 8) {
      console.log("1");
    }
  };

  render() {
    return <input onKeyDown={this.handleBackspace} />;
  }

Answer 2

可以看出 here，onKeyPress 只收到 charCode 而不是 keyCode。

这为我们提供了此问题的三个可能答案：

要么将事件更改为 onKeyDown
更改侦听器以检查e.charCode
使用 e.which，这对 onKeyPress 和 onKeyDown 都适用。

React onKeyPress 事件未检测到退格键

React onKeyPress event isn't detecting backspace

javascript

reactjs

onkeypress