如何避免在反应中使用 tabIndex 进行 OnKeyDown 捕获事件？

Question

我有一个问题，因为我正在使用 react-windows 库来制作新闻列表。

问题是我需要处理onKeyDown事件，因为需要在按钮上添加tabIndex 。

但是当我添加tabIndex时，它会激活 react-widows 库中的一些滚动行为。

如何在没有tabIndex的情况下使用 handle onKeyDown and Up events ？

这是文档的一个 div/按钮：

<div
              className="card-content-wrapper"
              role="button"
              id={collectionId + id}
              onClick={() => handleClick && handleClick(id)}
              onKeyDown={(e) => handleKeyDownUp && handleKeyDownUp(e, index)}
            >

Answer 1

您可以管理按键事件

class SimpleExample extends React.Component {
    onKeyDown =(event)=>{
        console.log('keyCode',event.keyCode)
    }
    render() {
        return (
             <div>
      <input type="text" id="one" onKeyDown={this.onKeyDown} />
    </div>
        );
    }
}