React事件系统入门

React基于虚拟DOM实现了一个合成事件层,我们所定义的事件处理器会接受到一个合成事件层对象的实例,它完全符合W3C标准,不会存在任何IE标准的兼容性问题。并且和原生的浏览器事件一样拥有同样的接口,同样支持事件的冒泡机制。所有事件都自动绑定到最外层上。

  • 合成事件的实现机制
    React不会把事件处理函数直接绑定到真实的节点上。而是把所有事件绑定到结构的最外层,使用一个统一的事件监听器,这个事件监听器维持了一个映射保存所有组件内部的事件监听和处理函数。当有事件发生的时候,首先由这个事件监听器处理,然后事件监听器在映射里面找到真正的事件处理函数并调用。这样做简化了事件处理和回收机制,效率很大的提升了。

在React中使用DOM原生事件时,一定要在组件卸载的时候,手动移除,否则可能会出现内存泄漏的问题,而在使用合成事件系统的时候,则不需要,因为React内部已经帮你妥善处理好这些问题了。

虽然合成事件能够解决内存泄漏的问题,但是在某些情况下,还是必须使用原生的时间才能实现。不要讲合成事件和原生事件混用,但是也可以通过e.target判断来避免。实际上,React的合成事件系统只是原生DOM事件系统的一个子集

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值