La semana pasada quería crear mi propia aplicación para presentaciones basada en Vue.js. Uno de los retos era ser capaz de navegar a través de las transparencias usando un control remoto inalámbrico que envía las teclas Avance Página y Retroceder Página  para navegar.

Hay bastante información en la red de cómo hacerlo pero no pude encontrar mi caso exacto. Este artículo intenta ayudar a cualquiera con el mismo problema.

Lo primero es conectar nuestro listener a los métodos `mounted` y `destroyed` de nuestro componente/vista :

 mounted () {
   window.addEventListener('keyup', this.handleKeyUp)
 },
 destroyed () {
   window.removeEventListener('keyup', this.handleKeyUp)
 },

Esto le dice a Vue que queremos ejecutar el método `handleKeyUp` de nuestro componente cuando ocurre un evento del tipo `keyup` (cuando una tecla deja de ser presionada). También le dice a Vue que elimine el listener cuando el componente sea destruido para evitar consumir recursos innecesarios.

En mi caso lo que quería era navegar a la siguiente y a la anterior transparencia cuando una tecla era pulsada. Este es mi método `handleKeyUp`:

    handleKeyUp () {
      // Page up
      if (event.keyCode === 33) {
        this.goToPreviousPage()

        return
      }

      // Page down
      if (event.keyCode === 34) {
        this.goToNextPage()
      }
    }

Eso ejecuta el método `goToPreviousPage` cuando se hace click en Página Anterior y `goToNextPage` cuando se hace click en Página Siguiente. Esas son las teclas que el control remoto manda.

Espero que esto te haya sido de ayuda. Si ha sido así !deja tu mensaje!