|
|
|
@ -62,40 +62,7 @@ hotkeys('ctrl+a,ctrl+b,r,f', function(event,handler) {
|
|
|
|
|
npm i -S react-hot-keys
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
例子
|
|
|
|
|
|
|
|
|
|
```js
|
|
|
|
|
import React, { Component } from 'react';
|
|
|
|
|
import Hotkeys from 'react-hot-keys';
|
|
|
|
|
|
|
|
|
|
export default class HotkeysDemo extends Component {
|
|
|
|
|
constructor(props) {
|
|
|
|
|
super(props);
|
|
|
|
|
this.state = {
|
|
|
|
|
output: 'Hello, I am a component that listens to keydown and keyup of a',
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
onKeyUp(keyName, e, handle) {
|
|
|
|
|
console.log("test:onKeyUp", e, handle)
|
|
|
|
|
this.setState({ output: `onKeyUp ${keyName}` });
|
|
|
|
|
}
|
|
|
|
|
onKeyDown(keyName, e, handle) {
|
|
|
|
|
console.log("test:onKeyDown", keyName, e, handle)
|
|
|
|
|
this.setState({ output: `onKeyDown ${keyName}` });
|
|
|
|
|
}
|
|
|
|
|
render() {
|
|
|
|
|
return (
|
|
|
|
|
<Hotkeys
|
|
|
|
|
keyName="shift+a,alt+s"
|
|
|
|
|
onKeyDown={this.onKeyDown.bind(this)}
|
|
|
|
|
onKeyUp={this.onKeyUp.bind(this)}
|
|
|
|
|
>
|
|
|
|
|
<div style={{ padding: "50px" }}> {this.state.output} </div>
|
|
|
|
|
</Hotkeys>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
详细使用方法请参考文档 [react-hotkeys](https://github.com/jaywcjlove/react-hotkeys)。
|
|
|
|
|
|
|
|
|
|
## 使用
|
|
|
|
|
|
|
|
|
|