React not responding to key down event

Question

I\'m trying to implement some very basic key press detection and I can\'t get it to work at all. I have a bare component that should be picking up on the onKeyDown

Answer 1

The problem is that ChildComponent is not a component but a component factory. It will be replaced with the result of rendering the element created with that factory.

Insert the ChildComponent in a div and attach any event listener to the div, not ChildComponent. Replace

with if you need inline display.

let {Component} = React;

class ChildComponent extends Component {
  render() {
    return ( press down a key );
  }
}

class App extends Component {
  handleKeyDown(event) {
    console.log('handling a key press');
  }

  render() {
    return ( 
 );
  }
}

React.render(, document.getElementById('app'));

See it in action on codepen

0 讨论(0)

查看其它4个回答

发布评论:

提交评论

---

•  加载中...