Add Event Listeners issue

Tell us what’s happening:

what’s wrong in my code?

Your code so far

class MyComponent extends React.Component {
  constructor(props) {
    this.state = {
      message: ''
    this.handleEnter = this.handleEnter.bind(this);
    this.handleKeyPress = this.handleKeyPress.bind(this);
  // change code below this line
  componentDidMount() {
  componentWillUnmount() {
  // change code above this line
  handleEnter() {
      message: this.state.message + 'You pressed the enter key! '
  handleKeyPress(event) {
    if (event.keyCode === 13) {
  render() {
    return (

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36.

Link to the challenge:

You still have to write “keydown” and the callback handleKeyPress() inside document.addEventListener().

This will help. :slight_smile:

Did you come up with the solution? I’m struggling with this react section. I feel like there’s a lot missing in terms of examples.

edit: I got it. The event has to be “keydown”. Let me know if you didn’t get it.

can you show me code?. thanks

This is how the prop and callback should be.

document.addEventListener(“keydown”, this.handleKeyPress);

1 Like