olena-ole / react_keyboard

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React Keyboard

React + Typescript cheat sheet

Make the App a class component with pressedKey in the state.

Here is the working version

  • before any key was pressed show the Nothing was pressed yet message;
  • when a key is pressed show a The last pressed key is [key] message;
  • use componentDidMount to add keyup handler:
    // DON'T import KeyboardEvent from React, because it is a regular event
    document.addEventListener('keyup', (event: KeyboardEvent) => {
      console.log(event.key);
    });
  • use removeEventListener to remove a global handler in componentWillUnmount.

Instructions

About

License:GNU General Public License v3.0


Languages

Language:JavaScript 70.7%Language:TypeScript 13.7%Language:HTML 10.3%Language:SCSS 4.3%Language:Shell 1.1%