当按下空格键而不是按钮上的空格键时，使用按键向下对触发按钮进行反应

Question

现在，我正在尝试创建一个激活OnKeyDown的按钮，但该命令仅在用户将鼠标悬停在按钮上并选中该按钮时有效。有没有一种方法可以使用OnKeyDown，这样您就可以将鼠标悬停在屏幕另一侧的img上，按空格键并激活按钮。 差不多

render(){
return(
<div>

<button onKeyDown = {this.dostuff}/>
<img src = {thing}/>
</div>

);

}

除非将鼠标悬停在图像上方并按空格键，否则该按钮将被激活

Answer 1

您可以通过使用类似于componentDidMount()的useEffect()钩子来实现这一点，并且在组件安装到屏幕上后，您可以在useEffect()函数中的代码中添加全局窗口事件侦听器

{a1}中的代码示例