es6编写reactjs事件处理函数绑定this三种方式
第一种:官方推荐的:
class LoginControl extends React.Component {
constructor(props) {
super(props);
this.handleLoginClick = this.handleLoginClick.bind(this);
this.handleLogoutClick = this.handleLogoutClick.bind(this);
this.state = {isLoggedIn: false};
}
第二种:比较方便
render() {
return (
<div onClick={this.handleClick.bind(this)}>ES6方式创建的组件</div>
);
}
第三种:箭头函数
return (
<button onClick={(e) => this.handleClick(e)}>
Click me
</button>
);
es6编写reactjs事件处理函数绑定this三种方式的更多相关文章
- JavaScript事件绑定的三种方式
(一)事件绑定的三种方式 (1)通过on的形式 <script type="text/javascript"> var div = document.getElemen ...
- JS中事件绑定的三种方式
以下是搜集的在JS中事件绑定的三种方式. 1. HTML onclick attribute <button type="button" id="upl ...
- JavaScript 中事件绑定的三种方式
以下是在 JS 中事件绑定的三种方式. 1. HTML onclick attribute <button type="button" id="uplo ...
- javascript函数命名的三种方式及区别
1, function fn(val1,val2) { alert(val1+val2); } fn(1,2); 2, var fn=function() { alert(val1+val2); } ...
- JavaScript中事件绑定的三种方式
JavaScript使得网页与用户友好交互,在使用 js 进行时间绑定的时候有三种绑定方式. 第一种:初学者以及普通写法 <div id="dom0"> <inp ...
- JS事件绑定的三种方式比较
js事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...
- js中的事件绑定的三种方式
1 直接在html标签中绑定 <button onclick = "show()"></button> 注意当你引用的js代码是包裹在window.onlo ...
- js中函数创建的三种方式
1.函数声明 function sum1(n1,n2){ return n1+n2; }; 2.函数表达式,又叫函数字面量 var sum2=function(n1,n2){ re ...
- js函数定义的三种方式
1.函数声明语法 function sum(num1, num2){ return num1 + num2; } 2.函数表达式定义 var sum = function (num1, num2){ ...
随机推荐
- [MongoDB] - Shell基本命令
在这里,我简单的记录一下MongoDB在shell客户端中使用的基本命令,比如创建/显示数据库,创建集合,删除集合等. 一.启动MongoDB并连接shell客户端 使用mongod.exe和mong ...
- JSON - 使用cJSON 解析Qt通过UDP发送的JSON数据
1,cJSON支持在C程序中创建和解析JSON数据,其提供多种方法供C程序使用,最直接的是将cJSON.c和cJSON.h加入到C工程中,源代码:https://github.com/DaveGamb ...
- node文件中的package.json文件解析
{ "name":"myejsapp", "version":"0.0.0", "private": ...
- C语言陷阱:浮点运算
在Stack overflow上看到这样一个问题. 计算如下表达式的值: P=(1/2-3/4)*(5/6-7/8)*…*[n/(n-1) - (n+2)/(n+3)]. 程序如下: #include ...
- [PHP] PHP1 与 CGI
早期,一个web程序通过cgi方式提供数据处理,编写cgi程序可以用不同的语言. 这个过程是,我们生成一个服务端可执行程序,处理 web server 传过来的请求,(设置header头)然后返回数据 ...
- GridControl基础设置(一)
1. 如何解决单击记录整行选中的问题 View->OptionsBehavior->EditorShowMode 设置为:Click 2. 如何新增一条记录 (1).gridView.Ad ...
- angular.js学习笔记:实现商品价格计算实例
<!DOCTYPE html> <html lang="en" ng-app> <!-- ng-app:初始化的指令 也可以解析局部--> &l ...
- DTD验证XML文档
DTD验证XML文档 1.DTD简介:DTD是Document Type Definition的缩写,即文档定义 1.1:DTD的内容包含: ...
- MES工具机器列表功能操作
概述 在机器权限组.限制工序变更等其他情况下,有时候需要重启中间件才能起作用,这样会直接影响其他人员的加工情况.为了改善这种情况,现在MES工具中新加了一个功能,可以单独重启某一个机器,其它机器不受影 ...
- SqlService性能检测和优化工具
工具概要 如果你的数据库应用系统中,存在有大量表,视图,索引,触发器,函数,存储过程,sql语句等等,又性能低下,而苦逼的你又要对其优化,那么你该怎么办?哥教你,首先你要知道问题出在哪里?如果想知道问 ...