我有一个应用程序（react / redux），它分为两部分：
我想要一个用于监听按键的Grid的键监听器。 例如。按下应选择下一个GridArea（元素），按Escape应选择“父”，如果适用的话。
在GridEditor中，您可以通过以下方式编辑各种GridAreaElements等的属性。输入字段。当与GridEditor交互时，尤其是这些输入字段时，我不希望启用按键监听器，因为它可以例如取消选择正在编辑的元素。
所以我想要的是在Grid组件（及其子组件）聚焦/活动时启用键监听器，但在Grid模糊/不活动时禁用它，即GridEditor是聚焦/活动的。
对于如何做到这一点有什么建议吗？
我想到了。不确定它是否是最好的解决方案。
首先，使事件监听器触发DOM元素上的事件，例如，一个div，它附加的元素必须有焦点。我们可以通过给它一个tabIndex来确保一个元素是可聚焦的：
<div className="myDiv" tabIndex="0" ref="myDiv" >
通过在div中添加ref，我们可以访问DOM元素并在componentDidMount中附加一个keydown事件监听器：
this.refs.myDiv.addEventListener('keydown', this.props.handleKeyPress, false)
这个keydown监听器只有在它所附加的DOM元素被聚焦时才会被触发:)