输入事件时无法访问keyCode / key事件

时间:2019-02-13 08:54:39

标签: vue.js vuejs2

我正在尝试在输入上绑定输入事件的输入上记录事件键,这是我尝试过的

<div id="app">
    <input @input="onInput" @keyup="onKeyUp" type="text">
</div>

vue脚本

new Vue({
    el : '#app',
    methods : {
        onInput(event){
            console.log(event.key); // returns undefined ?
            console.log(event.keyCode); // returns undefined ?
        }
        onKeyUp(event){
            console.log(event.key); // returns the key name
            console.log(event.keyCode); // returns the keycode ?
        }
    }
});

但是它给了我undefined,但是在输入键时,它给了我键键名和键码,正是我所期望的,只有在onInput方法上才给了我undefined。有什么帮助吗?

2 个答案:

答案 0 :(得分:2)

key事件上没有keyCodeinput属性。如果您想监听特定的键盘事件,请使用专用的监听器。

input旨在使所有修改表单元素值的事件都集中在一个保护伞下,以提供检测细微变化的方法,例如在拖动滑块而不释放时或值重复变化时执行的那些变化当您按住type="number"输入上的向上/向下箭头时。

您的最佳匹配是event.data属性(或者您可以获取event.target的特定属性)。但是,实际上,如果您要检测特定key的按下情况,请使用keydown

Input事件的当前官方推荐。

答案 1 :(得分:1)

也许这是您可以找到答案的地方,听起来像是应该的 https://forum.vuejs.org/t/get-value-from-input/15854

希望对您有帮助。