onKeyDown 没有响应答案

【问题标题】：onKeyDown is non responsiveonKeyDown 没有响应
【发布时间】：2019-03-23 19:50:40
【问题描述】：

使用Material-UI Table 我有这个：

<Table
 onKeyDown={event => console.log(event)}>
  <TableBody>
    ...
  </TableBody>
</Table>

当我用鼠标单击表格然后开始单击向上和向下箭头键时，控制台没有任何记录。我尝试将onKeyDown 放在我的应用程序的TableBody 以及整个父级div 上，但没有任何运气。

帮助？

【问题讨论】：

【解决方案1】：

所以，Material-UI Table 没有 onKeyDown 属性，但是，它的 docs 确实这么说：

提供的任何其他属性都将传播到根元素（原生元素）。

假设“根元素”是 table，那么您缺少的是 tabIndex 属性。

您需要将tabindex 属性（例如tabindex="1"）设置为某个值，所以它可以识别该表是键盘可选择的。这允许要触发的键盘事件。

【讨论】：

【解决方案2】：

这可能是因为您的表格不可聚焦。所以永远不会触发 onKeyDown。

您可以添加 tabIndex 以使其可聚焦，但请确保内部没有其他可聚焦元素，否则它们将优先。

<Table
 tabIndex='123'
 onKeyDown={event => console.log(event)}>
  <TableBody>
    ...
  </TableBody>
</Table>

【讨论】：