vue-keybindings

    1.0.0 • Public • Published

    Vue-Keybindings

    NPM version VueJS v2 compatible Downloads License

    Keyboard Shortcuts registration and Keybindings management

    Install

    npm install vue-keybindings --save

    Usage

    Configuration

    import VueKeybindings from 'vue-keybindings'
     
    Vue.use(VueKeybindings, {
        alias: {
            cancel: ['esc'],
            reload: ['alt', 'f5'],
            delete: 'shift+del'
        }
    })

    On Vuejs instance usage

    var vm = new Vue({
      shortcuts: {
        keydown: function (event) {
          console.log('key ', event, 'pressed')
          return false // stop alias calling
        },
        cancel: function () {
          console.log('escape key pressed')
          return false // stop propagation
        },
        customBinding: function (data) {
          console.log('this method was fired by some call to: vm.$shortcut.emit("customBinding", data)')
        }
      },
      methods: {
        clickButton: function (val) {
            this.$shortcut.emit('customBinding', val)
        }
      }
    })

    Dynamic shortcut event listeners

    Create a new listener

    this.$options.shortcuts.commandName = () => {
        console.log('do some action')
    }

    Remove existing listener

    delete this.$options.shortcuts.commandName;

    Dynamic shortcut registration

    Create a new keybinding

    this.$shortcut.add('command-name', 'ctrl+f6')
    // or
    this.$shortcut.add('commandName', ['ctrl', 'f6'])

    Remove existing keybinding

    this.$shortcut.remove('command-name', 'ctrl+f6')
    // unbind all actions for this shortcut
    this.$shortcut.unbind(['ctrl', 'f6'])
    // clear all keybindings
    this.$shortcut.clear()

    Derived from

    • Vivify-Ideas/vue-shortcuts
    • MetinSeylan/Vue-Socket.io

    Install

    npm i vue-keybindings

    DownloadsWeekly Downloads

    49

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    31.9 kB

    Total Files

    10

    Last publish

    Collaborators

    • avatar