title: How to handle onKeyDown event on div in ReactJS
body: <p>I'm trying to handle key event when load page component.
  First, I have a router:</p>
  
  <pre><code>&lt;Router&gt;
      &lt;Route exact path="/" component={Home} /&gt;
  &lt;/Router&gt;
  </code></pre>
  
  <p>In home component, I try to bind onKeyPress in div element but it's not work. I bind it on input element, it's worked.</p>
  
  <pre><code>return (
          &lt;div onKeyDown={this.__handleKeyDown} className="container" style={{ backgroundImage: `url(${this.state.backgroundbanner})` }}&gt;
              &lt;input
                  className="hidden"
                  onKeyDown={this.__handleKeyDown}
                  ref={(input) =&gt; { this.dummyInput = input; }}
                  /&gt;
              &lt;div className="container-shadow"&gt;
                  &lt;h1 className="main-title"&gt;{this.state.title}&lt;/h1&gt;
                  &lt;h3 className="main-description"&gt;{this.state.description}&lt;/h3&gt;
                  &lt;ListMovie cursor={ cursor } /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      )
  </code></pre>
  
  <p>How to bind event onKeyDown on div element or how to bind key event when load a page component in Route. Because, input element can be out-focus and this key event cannot be excute.</p>
  
  <p>Thanks.</p>