好客租房31-事件绑定this指向(bind)
事件this指向bind
利用ES5中bind方法 将事件处理程序中的this和组件实例绑定在一起
//导入react
import React from 'react'
import ReactDOM from 'react-dom'
//导入组件
// 约定1:类组件必须以大写字母开头
// 约定2:类组件应该继承react.component父类 从中可以使用父类的方法和属性
// 约定3:组件必须提供render方法
// 约定4:render方法必须有返回值
class HelloWorld extends React.Component {
//初始化state
state = {
geyao: 0,
}
constructor(){
super()
this.handleNum=this.handleNum.bind(this)
}
//抽离出来 this报错 事件处理中的this为underfine
handleNum(){
this.setState({
geyao: this.state.geyao + 1,
})
}
render() {
return (
<div>
<h1>{this.state.geyao}</h1>
<button onClick={this.handleNum}>点击加一</button>
</div>
)
}
}
ReactDOM.render(<HelloWorld />, document.getElementById('root'))
好客租房31-事件绑定this指向(bind)的更多相关文章
- 好客租房33-事件绑定this指向(总结)
1推荐使用class的实例方法 //导入react import React from 'react' import ReactDOM from 'react-dom' //导入组件 // 约 ...
- 好客租房30-事件绑定this指向(箭头函数)
1箭头函数 利用箭头函数自身不绑定this的特点 //导入react import React from 'react' import ReactDOM from 'rea ...
- 好客租房32-事件绑定this指向(class实例方法)
class实例方法 利用箭头函数的class实例方法 //导入react import React from 'react' import ReactDOM from 'react-dom' // ...
- jQuery事件绑定on()、bind()与delegate() 方法详解
jquery中有四种事件绑定函数,bind(),live(),on(),delegate(),由于live现在并不常用,因此不做过多解释. 1. bind()用法 $("div p" ...
- jQuery事件绑定—on()、bind()与delegate()
啃了一段日子的js相关了,学的过程中发现在jQuery中绑定事件时,有人用bind(),有人用on(),有人用delegate(),还有人用live(),看代码的时候觉得都实现功能了也就掀过去了,只是 ...
- Jquery中的事件绑定$("#btn").bind("click",function(){ })
Jquery中的事件绑定:$("#btn").bind("click",function(){ }) 由于每次都这么调用太麻烦,所以jquery就用$(&qu ...
- jquery mobile Checkbox动态添加刷新及事件绑定
jquery mobile Checkbox动态添加刷新及事件绑定 在微信项目中,涉及到一个多选功能.数据来自后台数据库,需要动态加载. 项目结构:微信api+web app.使用jquery mob ...
- JQuery的方便之处——宽高设置、坐标值和滚动条+事件绑定机制
1.元素的宽高 可以通过css来进行设置,例如:$("元素").css({"宽度":"值","高度":"值&q ...
- 关于JavaScript的事件绑定
js事件绑定的几种方式 JavaScript中有三种常用的绑定事件方法: 1. 在DOM元素中直接绑定: 2. 在JavaScript代码中绑定: 3. 绑定事件佳妮婷函数. 一.在DOM元素中直接绑 ...
随机推荐
- 在Nginx或Tengine服务器上安装证书
阿里云SSL证书服务支持下载证书并安装到Nginx.Tengine服务器上,本文介绍了证书安装的具体操作. 前提条件 已准备远程登录工具,例如PuTTY或者Xshell. 背景信息 本文档以CentO ...
- EMS导入导出邮箱
Exchange支持EMS命令导出用户邮箱内容作为备份的功能.当重要用户的邮件误删除后,可以通过导出的邮箱恢复数据. 1.授权管理用户 Exchange默认安装完成后,内置"Mailbox ...
- 耗时一个月上架了一款微信小程序,赚了2022年的第一笔副收入
今天不谈技术,只谈经历. 前戏 相信有很多的程序员都有一个产品梦,希望有一款属于自己产品.毕竟工作中遇到的有些"脑残"的产品经理不是一个两个,最后不得不因为"技术服务于业 ...
- SQL注入之延迟盲注
延迟盲注 你不知道你输入的数据在sql被执行后是否是正确或错误的.你只知道有数据. 利用原理 借助if语句,如果正确就sleep(5),延迟5秒返回数据.通过数据返回的时间大小判断自己的语句是否正确执 ...
- LC-数组-二分查找-704
二分查找 [left, right] 方式 [left, mid -1] [mid + 1, right] int left = 0, right = nums.length - 1; while ( ...
- 一篇文章带你搞懂InnoDB的索引|结合样例
关注公众号[程序员白泽],带你走进一个不一样的程序员/学生党 前言 前阵子面试的时候,在第三面问到了MySQL索引相关的知识点,并且给出了一些SQL语句分析索引的执行情况.所以今天这篇文章给大家讲讲索 ...
- toString()函数与valueOf()函数
一.前言 在等于运算符中,如果比较的内容包含对象类型数据,则会涉及隐式转换,那么就会调用toString()函数和valueOf()函数,下面我们将会了解到关于这两个函数的基本概念和使用场景. 二.t ...
- Java语言学习day30--8月5日
###10String类的其他方法 * A:String类的其他方法 * a: 方法介绍 * int length(): 返回字符串的长度 * String substring(int beginIn ...
- 2021.07.02 P1383 高级打字机题解(可持久化平衡树)
2021.07.02 P1383 高级打字机题解(可持久化平衡树) 分析: 从可以不断撤销并且查询不算撤销这一骚操作可以肯定这是要咱建一棵可持久化的树(我也只会建可持久化的树,当然,还有可持久化并查集 ...
- Luffy /2/ 后台数据库配置&前台创建配置
目录 二次封装Response 后台数据库配置 命令操作 pycharm连接 django操作mysql 方式一 方式二 user表设计 前台创建及配置 全局css样式配置 配置文件配置 二次封装Re ...