Great lib
Closed this issue · 3 comments
Have you tried Vue-Shortkey
looks great! haven't yet but will do, would there be a way to avoid the switch statement in the single method and listen to these events in a more declarative way?
That is a good point, I didn't think about it before.
Using your example, my point is:
- I have a play button, pause button and any other buttons to interact with the player.
- So, each button have their own functionality and their own method.
Im my mind it was something like this:
<play-button shortcut="enter" method="play()" />
<pause-button shortcut="esc" method="pause()" />
<forward-button shortcut="space" method="forward()" />
Somebody asked me if we can be more declarative in code level like:
data () {},
computed: {},
shortkeys: [
['enter', play()],
['esc', pause()],
['space', forward()]
]
I think it's a good approach, but I have some concern about the consistency of responsibilities.
Imagine that you have an element that dispatches some methods like a button, for example. This button can only be viewed conditionally. With declarative mode, you lose this behavior;
I see.. The proposal with shortkeys looks quite nice to me. With vue-shortcut the idea is that listeners are attached directly to the component itself and wraps/is rendered with whatever it controls.
For example,
<template>
<VueShortcut @nextItem="index + 1" @prevItem="index - 1">
<SlideShow :currentIndex="index" />
</VueShortcut>
</template>
or
<template>
<VueShortcut @showHelp="helpShowing = true">
<Help v-if="helpShowing" />
</VueShortcut>
</template>