div绑定键盘点击事件

最新推荐文章于 2023-07-07 11:28:20 发布

选择跳水或自由落体

最新推荐文章于 2023-07-07 11:28:20 发布

阅读量1k

点赞数 2

分类专栏：前端文章标签： vue.js 前端

本文链接：https://blog.csdn.net/qq_42244911/article/details/131592331

版权

前端专栏收录该内容

20 篇文章 0 订阅

订阅专栏

为箭头绑定绑定键盘方向键
在这里插入图片描述

   <div class="toggle-nav">
      <span
        v-if="leftToggleSt"
        @click="toggleGoods(1)"
        @keyup.left="toggleGoods(1)"
        class="toggle-left"
      >
        <a-icon type="left" class="icon" />
      </span>
      <span
        v-if="rightToggleSt"
        @click="toggleGoods(2)"
        @keyup.right="toggleGoods(2)"
        tabindex="0"
        class="toggle-right"
      >
        <a-icon type="right" class="icon" />
      </span>
    </div>

  created() {
    const self = this;
    document.onkeyup = function(e) {
      if (e.key == "ArrowLeft" || e.key == "ArrowUp") {
        self.toggleGoods(1);
      } else if (e.key == "ArrowRight" || e.key == "ArrowDown") {
        self.toggleGoods(2);
      }
    }
  },
methods:{
	toggleGoods(){}
}