VUE2 键盘事件

常规用法

<input type="text" @keyup="showInfo"></input>
methods:{

    showInfo(e){

         console.log(e.target.value)  //这种情况会是输入框中实时输入什么,就会实时打印出什么

    }

}

常用按键别名

<input type="text" @keyup.enter="showInfo"></input>  <!--表示按下回车键后输入框内容才执行函数-->
  1. 回车 enter

  2. 删除 delete (捕获“删除”和“退格”键)

  3. 退出 esc

  4. 空格 space

  5. 换行 tab (特俗,必须配合keydown去使用)

  6. 上 up

  7. 下 down

  8. 左 left

  9. 右 right

系统修饰键

<input type="text" @keyup.ctrl.y="showInfo"></input>  <!--表示按下Ctrl + Y 后输入框内容才执行函数-->

系统修时间(用法特殊):ctrl、alt、shift、meta
(1)配合leyup使用:按下修饰键的同时,再按下其他键,随后释放其他键,事件才能被触发
(2)配合keydown使用:正常触发事件

posted @ 2023-02-28 10:12  中亿丰数字科技  阅读(105)  评论(0)    收藏  举报