美文网首页
2018-10-23react事件系统

2018-10-23react事件系统

作者: 折梅踏雪 | 来源:发表于2018-10-23 15:40 被阅读0次

1.合成事件的绑定方式

react事件的绑定方式在写法上与原生的html事件监听器属性很相似,并且含义和触发场景也都完全一致。

2.合成事件的实现机制

在react的底层,对合成事件主要做了两件事:事件委派和自动绑定

    1).事件委派

事件委派并不会把事件处理函数直接绑定到真实的节点上,而是把所有事件绑定到结构的最外层,使用一个统一的事件监听器。

    2)自动绑定

在react组件中,每个方法的上下文都会指向该组件的实例,即自动绑定this为当前组件

绑定方法:

<1>,bind方法,这个方法可以帮助我们绑定事件处理器内的this,并可以向事件处理器中传递参数

<2>,构造器内声明。在组件的构造器内完成了this的绑定。这种绑定方式的好处在于仅需要一次绑定,而不需要每次调用事件监听器时去执行绑定。

<3>,箭头函数

箭头函数不仅是函数的"语法糖",它还自动绑定了定义此函数作用域的this,因此我们不需要再对它使用bind方法,

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

4.

相关文章

  • 2018-10-23react事件系统

    1.合成事件的绑定方式 react事件的绑定方式在写法上与原生的html事件监听器属性很相似,并且含义和触发场景也...

  • 2018-10-23react合成事件和js原生事件

    1.事件传播与阻止事件传播 浏览器原生DOM事件的传播可以分为3个阶段:事件捕获阶段,目标对象本身的事件处理程序调...

  • 事件系统

    事件要遵循小驼峰的命名法则 小驼峰命名参考 合成的事件对象 nativeEvent 获取原有的事件对象

  • hitText底层实现

    事件是不是系统事件,是系统事件交给代理处理(比如程序启动完成时交给代理开启一个runRoop); 不是系统事件就交...

  • ET事件系统

    事件系统 ET的事件系统主要是理解EventSystem这个类的运作方式,下面开始介绍事件系统 工具类 Objec...

  • 点击事件处理, 以及hitTest:withEvent:实现

    发送触摸事件后, 系统会将事件添加到系统UIApplication的事件管理队列中 UIApplication会在...

  • React学习之漫谈React

    事件系统 合成事件的绑定方式 Test 合成事件的实现机制:事件委派和自动绑定。 React合成事件系统的委托机制...

  • AM600_PLC中PrepareStart系统事件说明

    1、 概要 本文针对PrepareStart系统事件的使用进行说明,PrepareStart系统事件中调用可用于设...

  • 点击事件处理

    发送触摸时间后,系统会将事件添加到系统UIApplication的事件管理队列中 UIApplication 会在...

  • 应急响应大致流程

    1 事件发生 1.1 确认事件类型 a、web入侵:挂马、篡改、webshellb、系统入侵:系统异常、RDP爆破...

网友评论

      本文标题:2018-10-23react事件系统

      本文链接:https://www.haomeiwen.com/subject/rzqazftx.html