Add keybindings in React apps
npm install react-keybindings
npm install --save react-keybindings
`
Usage of
mapActionsToKeys(keymap)
React Keybindings provides a higher-order component to wrap an existing component. It allows you to map actions to shortcuts. Then you are able to know which actions have been triggered and which keys have been pressed.
$3
* keymap (_Object_): this is an object which map actions to shortcuts. You can write shortcuts as strings (e.g. "ctrl+shift+s") or as arrays of key codes (e.g. [17, 65]).
$3
It returns a React component class that injects keyActions into your component.
Example
`js
import React from "react"
import mapActionsToKeys from "react-keybindings"
class App extends React.Component {
handleKeyDown = () => {
console.log(this.props.keyActions) // ["FOO"]
};
render() {
return (
tabIndex={ 0 }
onKeyDown={ this.handleKeyDown }>
{ / / }