Windows Event KeyPress

Question

I would like to know if it is possible to activate an event with keyboard arrows, directly on the page, without having to have the mouse in an input or something like this, I tried this and it did not work.

keyPress (e){
 if(e.key == "ArrowLeft"){
   console.log(e.key)
 }
}

Answer 1

Yes you can do it. But when you call it, it is not on keyPress instead on keyDown .

You can add an eventListener to listen to keypress in componentDidMount .

  componentDidMount(){ window.addEventListener('keydown', this.keyPress); } componentWillUnmount(){ window.removeEventListener('keydown', this.keyPress); } keyPress (e){ if(e.key == "ArrowLeft"){ console.log(e.key) } }