A simple mixin for application hotkeys with react
npm install react-hotkeyreact-hotkey
============

A simple mixin for application hotkeys.
Provides a react synthetic event to the named event handler, but only when the
component is mounted.
For more info, check out the
demo
from the
example
folder.
Install
-------
npm install react-hotkey --save
As of version 0.7.0, React 15.4+ is required. If you're using an older version
of react, then you should stick with 0.6.0.
Usage
-----
``js
var hotkey = require('react-hotkey');
// Enable event listening, can be safely called multiple times
hotkey.activate();
// The default is to listen for 'keyup' but you can listen to others by passing an argument
hotkey.activate('keydown');
React.createClass({
mixins: [hotkey.Mixin('handleHotkey')],
handleHotkey: function(e) {
// receives a React Keyboard Event
// http://facebook.github.io/react/docs/events.html#keyboard-events
}
})
`
React Mixins do not work with ES2015. Instead one may use the addHandler and removeHandler functions:
`js
import React from 'react';
import hotkey from 'react-hotkey';
hotkey.activate();
class MyComponent extends React.Component {
constructor() {
this.hotkeyHandler = this.handleHotkey.bind(this);
}
handleHotkey(e) {
console.log("hotkey", e);
}
componentDidMount() {
hotkey.addHandler(this.hotkeyHandler);
}
componentWillUnmount() {
hotkey.removeHandler(this.hotkeyHandler);
}
}
``
Acknowledgements
----------------
This approach was extracted from
react-bootstrap.
License
-------
MIT