react下绑定keydown事件

原创 Luna325 教程 react 67阅读 2019-05-22 17:36:19 举报

原生js里绑定enter事件直接在input里绑定onkeypress,onkeydown等事件,在事件里判断下e.keycode===13即可。

但是在react里,不生效。因为react里的事件对象为 SyntheticEvent(合成对象),它是依据 DOM Level 3 的事件规范实现的,这样做最大的好处是可以屏蔽浏览器的差异,各种厂商的浏览器对规范的实现程度是不一样的,如果直接使用原生 DOM 事件对象的话,有些情况下你需要考虑浏览器的兼容性。而 React 通过 SyntheticEvent 已经把这些琐事帮你搞定了,在任何 React 支持的浏览器下,事件对象都有一致的接口。

React 中所有的事件处理函数都会接收到一个 SyntheticEvent 的实例 e 作为参数,如果在某些特殊的场景中,你需要用到原生的 DOM 事件对象,有两种方式可以解决。

通过 e.nativeEvent 来获取。

或者可以通过addEventListener解决

另外如果用antd的话 建议直接用Form,antd已处理过此功能

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复