Using onkeypress on react

I just want to get an action when I press i key in this case is enter, but I do not know how to do it in react I do no know what element use I tried button, div and many others I only could use input but I get a text-form and I do not want that I just want to press a key and thats it.`import React from “https://cdn.skypack.dev/react
import ReactDOM from “https://cdn.skypack.dev/react-dom

class TestingKeyPress extends React.Component{
  constructor(props){
   super(props)
    this.state={
      message: "you didn't press enter yet, press it!" 
    }
     this.handleKeyPress=this.handleKeyPress.bind(this);
  }
  
  handleKeyPress(event){
    if(event.key === 'Enter'){
      this.setState({
        message: "you pressed enter!!"
      });
    }
  }

    
  
  render(){
    return(
    <div>
        {this.state.message}
       <input type="text" onKeyPress={this.handleKeyPress} />
        
    </div>
    )
  }
}

ReactDOM.render(<TestingKeyPress />,document.getElementById("root"));`

I am trying to do this to pass the drum machine challenge

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.