Tengo el siguiente código en Vue que funciona para los eventos de clic pero no para los eventos del teclado:
<span v-show="show" @click.prevent="backTo" @keyup.enter="backTo" @keyup.space="backTo"> Tengo configurado el método backTo() para ir a la página anterior, pero cuando uso los eventos del teclado no hace nada. Cuando se hace clic, funciona bien.
Coloqué una alerta en el método para entender lo que está haciendo, pero en el evento del teclado no hace nada y al hacer clic con el onmouseclick recibo la alerta.
span s no suelen ver eventos de teclado. Cambie a un elemento naturalmente editable, o agregue tabindex="0" o agregue contenteditable=true
Vue.config.productionTip = false; var app = new Vue({ el: '#app', data: { }, methods: { backTo() { alert('got here!'); } } }) <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <span tabindex="0" @click.prevent="backTo" @keyup.enter="backTo" @keyup.space="backTo">Click on me to give me focus, then press space or enter</span> </div>