在使用 React 中的 Class extends写法,如果 onClick 绑定一个方法就需要 bind(this),如果使用React.createClass 方法就不需要

解析:

React.createClass 是ES5 的写法默认绑定了 bind 写法

在 ES6 中新增了class,绑定的方法需要绑定 this,如果是箭头函数就不需要绑定 this

示例:

第一种写法:

_handleClick(e){
console.log(this);
}
render(){
return (
<div><h1 onClick={this._handleClick.bind(this)}>点击<h1></div>
)
}

第二种写法:

constructor(props){
super(props);
this._handleClick=this._handleClick.bind(this)
}
_handleClick(e){e}{
console.log(this);
}
render(){
return(
<div><h1 onClick={this._handleClick}>点击</h1></div>
)
}

第三种写法:

  _handleClick=(e)=>{
//使用箭头函数
console.log(this);
}
render(){
return (
<div><h1 onClick={this._handleClick}>点击</h1></div>
)
}

ES6中bind(this)用法说明的更多相关文章

  1. js中bind的用法,及与call和apply的区别

    call和apply的使用和区别不再做阐述,可以参考我的另一篇随笔<JavaScript中call和apply方法的使用>(https://www.cnblogs.com/lcr-smg/ ...

  2. ES6中set的用法回顾

    ES6中的set类似一个数组,但是其中的值都是唯一的,Set本身是一个构造函数,用来生成 Set 数据结构. set函数可以接受一个数组作为参数,用来初始化: const set = new Set( ...

  3. ES6中Class的用法及在微信小程序中的应用实例

    1.ES6的基本用法 ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6 的class可以看作只是一个语法糖,它的绝 ...

  4. ES6中的Promise用法

    Node的产生,大大推动了Javascript这门语言在服务端的发展,使得前端人员可以以很低的门槛转向后端开发. 当然,这并不代表迸发成了全栈.全栈的技能很集中,绝不仅仅是前端会写一些HTML和一些交 ...

  5. ES6中const的用法

    const声明一个只读的常量.一旦声明,常量的值就不能改变.且const一旦声明变量,就必须立即初始化,不能留到以后赋值. const的作用域与let命令相同:只在声明所在的块级作用域内有效. con ...

  6. ES6 中set的用法

  7. ES6中Class与export简单用法

    一.Class ES6中的Class用法类似Java的Class用法,但class的本质是js一个function //定义类 class Person { //定义构造方法 constructor( ...

  8. C++标准 bind函数用法与C#简单实现

    在看C++标准程序库书中,看到bind1st,bind2nd及bind的用法,当时就有一种熟悉感,仔细想了下,是F#里提到的柯里化.下面是维基百科的解释:在计算机科学中,柯里化(英语:Currying ...

  9. js中call、apply、bind的用法

    原文链接:http://www.cnblogs.com/xljzlw/p/3775162.html var zlw = { name: "zlw", sayHello: funct ...

随机推荐

  1. 集腋成裘-05-angularJS -初识angular

    私以为angular的最大特点是:只关注数据 1.1 angular之:双向绑定 <!DOCTYPE html> <html ng-app=""> < ...

  2. 修改Linux服务器的ttl值

    [root@test_android_client_download ~]# cat /etc/sysctl.conf |grep net.ipv4.ip_default_ttlnet.ipv4.ip ...

  3. WCF三种通信方式

    一.概述 WCF在通信过程中有三种模式:请求与答复.单向.双工通信.以下我们一一介绍. 二.请求与答复模式 描述: 客户端发送请求,然后一直等待服务端的响应(异步调用除外),期间处于假死状态,直到服务 ...

  4. 一脸懵逼学习Hive的安装(将sql语句翻译成MapReduce程序的一个工具)

    Hive只在一个节点上安装即可: 1.上传tar包:这个上传就不贴图了,贴一下上传后的,看一下虚拟机吧: 2.解压操作: [root@slaver3 hadoop]# tar -zxvf hive-0 ...

  5. 利用redis统计信息对CPU使用率进行收集

    http://dy.163.com/v2/article/detail/DQT2ROO10511RVML.html

  6. Json对象处理.将对象处理成dic数组.

    var parser = new JsonConfigurationFileParser();var dict = parser.Parse("json"); using Newt ...

  7. C# 之 提高WebService性能大数据量网络传输处理

    1.直接返回DataSet对象 特点:通常组件化的处理机制,不加任何修饰及处理: 优点:代码精减.易于处理,小数据量处理较快: 缺点:大数据量的传递处理慢,消耗网络资源: 建议:当应用系统在内网.专网 ...

  8. 【转】ArcGIS10的附件功能

    转自:http://blog.csdn.net/linghe301/article/details/6386176 老是忘记怎么使用这个ArcGIS10的附件功能,这次就做个记录吧. 在项目应用过程中 ...

  9. 函数对象的call()、apply() 方法区别

    函数对象的call().apply() 方法 函数作为对象提供了call(),apply() 方法,他们也可以用来调用函数,这两个方法都接受一个对象作为参数,用来指定本次调用时函数中this的指向: ...

  10. CodeForces 516B Drazil and Tiles 其他

    原文链接http://www.cnblogs.com/zhouzhendong/p/8990658.html 题目传送门 - CodeForces 516B 题意 给出一个$n\times m$的矩形 ...