参考这篇文章：Choosing the Best Approach for React Event Handlers

1、function.bind()方式

2、inline arrow function方式

3、Class Property Arrow Functions

第一种方式比较常见，但因为每次父组件render时，会重新生成一个函数，相当于子组件的props发生了改变。子组件的PureComponent会失效。

第二种是一种性能好，书写简单，功能强大的方式。

第三种因为是类的属性，可能涉及到继承、方法调用问题，性能有影响。

https://reactjs.org/docs/handling-events.html

最正确的React事件绑定方式的更多相关文章

  1. React事件绑定的方式

    一.是什么 在react应用中,事件名都是用小驼峰格式进行书写,例如onclick要改写成onClick 最简单的事件绑定如下: class ShowAlert extends React.Compo ...

  2. React事件绑定的几种方式对比

    React事件绑定 由于类的方法默认不会绑定this,因此在调用的时候如果忘记绑定,this的值将会是undefined.通常如果不是直接调用,应该为方法绑定this.绑定方式有以下几种: 1. 在构 ...

  3. jquery事件绑定方式总结（补充）

    总结 : 1.简单事件绑定方式:事件名()  如:click() 2.高级事件绑定方式:bind(事件名,数据参数,function)    3.动态生成元素事件绑定方式:live(事件名,数据参数, ...

  4. react事件绑定的三种常见方式以及解决Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state问题思路

    在 React 组件中,每个方法的上下文都会指向该组件的实例,即自动绑定 this 为当前组件. 而且 React 还会对这种引用进行缓存,以达到 CPU 和内存的优化.在使用 ES6 classes ...

  5. javaScript事件机制深入学习(事件冒泡，事件捕获，事件绑定方式，移除事件方式，阻止浏览器默认行为，事件委托，模拟浏览器事件，自定义事件)

    前言 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码.这种在传统软 ...

  6. react 入坑笔记（四） - React 事件绑定和传参

    React 事件处理 建议:在了解 js 的 this 取值后食用更佳. 一.react 与 Html 中用法的异同和注意点 html 中的绑定事件的写法: <button onclick=&q ...

  7. 移动端和pc端事件绑定方式以及取消浏览器默认样式和取消冒泡

    ### 两种绑定方式 (DOM0)1.obj.onclick = fn; (DOM2)2. ie:obj.attachEvent(事件名称,事件函数); 1.没有捕获(非标准的ie 标准的ie底下有 ...

  8. React事件绑定与解绑

    React中事件分类 React中事件绑定分为两种: 1.直接添加在React元素上的事件,这是React在基于Virtual DOM的基础上实现的符合w3c规范的合成事件(SyntheticEven ...

  9. DOM常用事件绑定方式与实例

    一.常用的事件 onclick 点击事件 模态框实例 <input type="button" id="b1" style="width:50p ...

随机推荐

  1. Hive、Pig、HBase的关系与区别

    欢迎关注大数据和人工智能技术文章发布的微信公众号:清研学堂,在这里你可以学到夜白(作者笔名)精心整理的笔记,让我们每天进步一点点,让优秀成为一种习惯! Pig 一种操作hadoop的轻量级脚本语言,最 ...

  2. spring常用管理bean注解

    spring提供了多个注解声明Bean为spring管理的Bean @Controller 声明此类是一个MVC类,通常与@RequestMapping一起使用 @Controller @Reques ...

  3. wcf 服务创建，配置，测试

    一.WCF创建: 常规的创建WCF服务是通过SOAP传输的,很多网站开发人员想放弃使用XML而使用JSON,这个时候可以参照:http://www.cnblogs.com/zhili/p/WCFRes ...

  4. 「6月雅礼集训 2017 Day11」tree

    [题目大意] 给出一棵带权树,有两类点,一类黑点,一类白点. 求切断黑点和白点间路径的最小代价. $n \leq 10^5$ [题解] 直接最小割能过..但是树形dp明显更好写 设$f_{x,0/1/ ...

  5. 【BZOJ】1601: [Usaco2008 Oct]灌水

    [算法]最小生成树 [题解] 想到网络流,但是好像不能处理流量和费用的关系. 想到最短路,但好像不能处理重复选边的问题. 每条边只需要选一次,每个点就要遍历到,可以想到最小生成树. 建超级源向每个点连 ...

  6. bufferd对象详解

    使用buffer类处理二进制数据 在客户端javascript脚本代码中,对于二进制数据并没有提供一个很好的支持.然后在nodejs中需要处理像TCP流或文件流时,必须要处理二进制数据.因此在node ...

  7. 极致的 Hybrid：航旅离线包再加速！(转)

    资源离线的思路简单.场景复杂,最复杂的就是 H5 活动页面的离线化.Mobile Web 在弱网提速的唯一的办法就是坚决杜绝不必要的(运行时)网络请求,即除了 Json 格式的动态数据和其携带的商品配 ...

  8. Bagging和Boosting 概念及区别（转）

    Bagging和Boosting都是将已有的分类或回归算法通过一定方式组合起来,形成一个性能更加强大的分类器,更准确的说这是一种分类算法的组装方法.即将弱分类器组装成强分类器的方法. 首先介绍Boot ...

  9. 结合BeautyEye开源UI框架实现的较美观的Java桌面程序

    BeautyJavaSwingRobot 结合BeautyEye开源UI框架实现的较美观的Java桌面程序,主要功能就是图灵机器人和一个2345网站万年历的抓取.... 挺简单而且实用的一个项目,实现 ...

  10. go环境变量及build文件

    package main /* windows go环境设置: # 参考:https://blog.csdn.net/quicmous/article/details/80360126 GOROOT ...