useKey

当使用键盘键时,React UI 传感器钩子执行handler

Usage

  1. import useKey from 'react-use/lib/useKey';
  2. const Demo = () => {
  3. const [count, set] = useState(0);
  4. const increment = () => set(count => ++count);
  5. useKey('ArrowUp', increment);
  6. return (
  7. <div>
  8. Press arrow up: {count}
  9. </div>
  10. );
  11. };

Or as render-prop:

  1. import UseKey from 'react-use/lib/comps/UseKey';
  2. <UseKey filter='a' fn={() => alert('"a" key pressed!')} />

Reference

  1. useKey(filter, handler, options?, deps?)

Examples

  1. useKey('a', () => alert('"a" pressed'));
  2. const predicate = (event) => event.key === 'a'
  3. useKey(predicate, handler, {event: 'keyup'});