react中 onkeyPress键盘事件keyCode无效的问题

我们都知道键盘事件有

    1.onkeydown,

    2.onkeyup,

    3.onkeypress

三种键盘事件

对应的按下键盘上的键的时候，有keyCode, charCode两个属性。

在js中，keyCode表示用户按键的实际编码，而charCode表示用户按键的字符编码

（IE下keyCode属性对于keypress事件，表示按下按键的Unicode字符；对于keydown/keyup 事件，表示按下按键的数字代码。无charCode属性）

在react 中，对于keyCode和charCode，有和js中不同的地方：

对于onkerPress,keyCode属性获取值为0，charCode属性有值；对于onkeyDown和onkeyUp,keyCode属性有值，charCode获取值为0。

 

    hanldePress(event) {
        console.log("keyPress", event.charCode, event.keyCode, event.key)
    }
    hanldeDown(event) {
        console.log("keyDown", event.charCode, event.keyCode, event.key)
    }
    hanldeUp(event) {
        console.log("keyDown", event.charCode, event.keyCode, event.key)
    }

打印结果

结论：在react中 keyPress用charCode,keyDown和keyUp用keyCode

 

 

 

来源：CSDN

作者：wa-monster

链接：https://blog.csdn.net/qq_40291929/article/details/85158915