cari

Rumah  >  Soal Jawab  >  teks badan

Tambahkan pintasan papan kekunci untuk butang dalam vuejs

Saya mempunyai butang yang melakukan tindakan tertentu apabila diklik dengan tetikus. Saya mahu kaedah yang sama dicetuskan apabila kekunci anak panah atas papan kekunci ditekan.

<button @click="doSomething()"> PRESS ME </button>

doSomething(){
  console.log('clicked')
}

Jadi dalam contoh ini, saya mahu console.log('clicked') apabila anak panah atas papan kekunci ditekan. Bagaimana saya boleh melakukan ini?

P粉771233336P粉771233336335 hari yang lalu443

membalas semua(2)saya akan balas

  • P粉031492081

    P粉0314920812024-01-05 10:06:30

    Semoga membantu.

    doSomething(){
      console.log('clicked')
    }
    
    var buttonBtn = document.getElementById("btn");
    buttonBtn.addEventListener("keyup", function(event) {
      event.preventDefault();
      this.doSomething();
    });
    <button id="btn" @click="doSomething()"> PRESS ME </button>

    balas
    0
  • P粉994092873

    P粉9940928732024-01-05 00:54:05

    Boleh guna vueuse 中的 onkeyrinkle

    <template>
      <div>
        <button @click="doSomething">btn</button>
      </div>
    </template>
    
    <script setup>
    import { onKeyStroke } from '@vueuse/core';
    
    const doSomething = () => {
      console.log('do something');
    }
    
    onKeyStroke(['ArrowUp'], (e) => {
      doSomething();
    });
    </script>

    Ini satu lagi demo

    Ditulis oleh

    stackblitz.com 不支持