Skip to content

Commit

Permalink
add component with pressedKey
Browse files Browse the repository at this point in the history
  • Loading branch information
DanKhuda committed Aug 9, 2024
1 parent 1a3e715 commit 552f0f0
Showing 1 changed file with 35 additions and 5 deletions.
40 changes: 35 additions & 5 deletions src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,37 @@
import React from 'react';

export const App: React.FC = () => (
<div className="App">
<p className="App__message">The last pressed key is [Enter]</p>
</div>
);
type State = {
lastPressedKey: string;
};

export class App extends React.Component<{}, State> {
state: State = {
lastPressedKey: '',
};

handleKeyBoard = (event: KeyboardEvent) => {
this.setState({
lastPressedKey: event.key,
});
};

componentDidMount(): void {
document.addEventListener('keyup', this.handleKeyBoard);
}

componentWillUnmount(): void {
document.removeEventListener('keyup', this.handleKeyBoard);
}

render() {
return (
<div className="App">
<p className="App__message">
{this.state.lastPressedKey
? `The last pressed key is [${this.state.lastPressedKey}]`
: 'Nothing was pressed yet'}
</p>
</div>
);
}
}

0 comments on commit 552f0f0

Please sign in to comment.