Renderless (global) event listener component https://www.youtube.com/watch?v=qA2RfGbgNzk https://github.com/shentao/vue-global-events

README.vue

<template>
  <div>
    <event-listener @keydown.space="doSomething">
    ...
  </div>
</template>

<script>
export default {
  methods: {
    doSomething () {
      // Start-stop a video for example
    }
  }
}
</script>

EventListener.js

export default {
  render () {},
  
  mounted () {
    Object.keys(this.$listeners)
      .foreach(event => {
        window.addEventListener(event, this.$listeners[event])
      })
  },
  
  destroyed () {
    Object.keys(this.$listeners)
      .foreach(event => {
        window.removeEventListener(event, this.$listeners[event])
      })
  }
}