https://github.com/mitscherlich/vue-use-hotkeys
Vue composition for using keyboard shortcuts in components. Inspired by [react-hotkeys-hook](https://github.com/JohannesKlauss/react-hotkeys-hook)
https://github.com/mitscherlich/vue-use-hotkeys
composition-api hotkeys javascript typescript vue
Last synced: 11 months ago
JSON representation
Vue composition for using keyboard shortcuts in components. Inspired by [react-hotkeys-hook](https://github.com/JohannesKlauss/react-hotkeys-hook)
- Host: GitHub
- URL: https://github.com/mitscherlich/vue-use-hotkeys
- Owner: Mitscherlich
- License: mit
- Created: 2022-01-22T14:43:15.000Z (over 4 years ago)
- Default Branch: dev
- Last Pushed: 2024-05-26T16:30:40.000Z (about 2 years ago)
- Last Synced: 2024-05-27T21:00:13.600Z (about 2 years ago)
- Topics: composition-api, hotkeys, javascript, typescript, vue
- Language: TypeScript
- Homepage: https://codesandbox.io/s/vue-use-hotkeys-demo-6kygbb
- Size: 891 KB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-use-hotkeys
Vue composition for using keyboard shortcuts in components.
This is a hook version for [hotkeys](https://github.com/jaywcjlove/hotkeys) package.
## Install
via pnpm, yarn or npm:
```sh
$ pnpm add vue-use-hotkeys
# or
$ yarn add vue-use-hotkeys
# or
$ npm i -S vue-use-hotkeys
```
## Usage
```jsx
import { defineComponent, ref } from 'vue'
import { useHotkeys } from 'vue-use-hotkeys'
export default defineComponent(() => {
const count = ref(0)
useHotkeys('ctrl + k', () => {
count.value += 1
})
return () => (
Pressed ctrl + k {count.value} times.
)
})
```
Preview demo:
- [CodeSandbox Example](https://codesandbox.io/s/vue-use-hotkeys-demo-6kygbb)
# To-Do(s)
- [x] add support of `@vue/composition-api`;
## License
MIT © [Mitscherlich](https://mitscherlich.me)