spinbox 上下箭头事件_[React] 3 - 自动绑定 (事件绑定)

1. 自动绑定 (事件绑定)

绑定this: React为什么要这么做?

是js中this绑定方式决定的，和react工作方式无关。
函数处理, 是作为回调传递的，这样就会丢失了上下文, 所以this为 undefined
this不是默认指向在全局的吗? 在严格模式下Strict mode, 就是个undefined, 不严格模式为全局

// 三种方式
// 1. 构造器绑定
constructor (props) {super(props)this.handleClick3 = this.handleClick3.bind(this)}// 2. 箭头函数
<button onClick={() => this.handleClick2()}>// 3. bind方式
<button onClick={this.handleClick4.bind(this)}>

2. 为什么要绑定this?

LIN.JY666：[JS基础] 7 - this, call/apply/bind/箭头函数zhuanlan.zhihu.com

如果是个函数调用，那么this指向函数内部，如果是非严格模式，那么this指向window
如果是个对象里的函数调用，那么this指向该对象
this要等到执行的时候，才确定是什么。

为了绑定当前执行的环境, 当前执行的作用域

const object = {name: '123',fn: function () {// 隐式绑定console.log('this.name', this.name)}
}
const name = 'test'// 1. ?
object.fn() // 返回'123' 对象里的函数调用, this指向该对象// 2. ?
objFn = object.fn
objFn() // 返回 test 函数调用，那么this指向函数内部，如果是非严格模式，那么this指向window// 3. 绑定, object.fn的this 使用object内部
objFnn = object.fn.bind(object)
objFnn() // '123'

spinbox 上下箭头事件_[React] 3 - 自动绑定 (事件绑定)相关推荐

js阻止子元素事件_阻止 JS 的冒泡事件
用了一段时间google inbox,赶脚mail task的样式很酷炫,于是也模仿着做了一个task管理系统. Google task有个behavior是点击页面别处,当前展开的mail就会收起. ...
python读取键盘事件_使用 Python 记录键盘事件！真的很神奇~
今天也不知道是想了什么,突然就想要试试看我有效击键时的手速到底有多快.为此,需要记录下来击键的记录.于是找到了 Python 的keyboard 库. 安装非常简单,只需执行pip install k ...
navicat for mysql 事件_[数据库] Navicat for MySQL事件Event实现数据每日定期操作
在我们操作数据库过程中,通常会遇到一些某个时间点操作数据库的问题,例如: (1).每天凌晨12点对数据库进行定时备份,结算和汇总: (2).每天凌晨2点删除数据库前三天的数据: (3).插入某个数据超 ...
DOM（四）——事件、事件模型（冒泡）与事件对象的功能
文章目录一.事件二. 事件绑定 1. 在HTML中手工绑定 2. 在js中以赋值方式绑定 3. 在js中以添加事件监听对象的方式绑定: 3.1 原理 3.2 移除事件监听对象三.事件模型四.事 ...
react中绑定点击事件_在React中绑定事件处理程序的最佳方法
react中绑定点击事件 by Charlee Li 通过李李在React中绑定事件处理程序的最佳方法 (The best way to bind event handlers in React) ...
这就是为什么我们需要在React的类组件中绑定事件处理程序
by Saurabh Misra 索拉·米斯拉(Saurabh Misra) 这就是为什么我们需要在React的类组件中绑定事件处理程序 (This is why we need to bind ev ...
js 监听安卓事件_百行代码实现js事件监听实现跨页面数据传输
百行代码实现js事件监听实现跨页面数据传输使用场景类似消息队列的使用场景,支持同页面和跨页面通信,发送消息和接收消息技术原理跨页面通信: 基于事件监听,通过监听 storage事件监听回调机制 ...
React 项目--button 绑定事件（15）
不知不觉中写博客已经成为了一种习惯,不仅仅是一种学习知识吧,也是一种清楚自己学习了那些的内容.在前面的博客中我们慢慢的介绍了一些react基本的语法,现在我们继续来react按钮绑定事件环境准备首 ...
springboot 获取bean_SpringBoot高级(自动配置事件监听监控)
SpringBoot自动配置 condition-1 Condition是Spring4.0后引入的条件化配置接口,通过实现Condition接口可以完成有条件的加载相应的Bean @Conditio ...

spinbox 上下箭头事件_[React] 3 - 自动绑定 (事件绑定)

1. 自动绑定 (事件绑定)

2. 为什么要绑定this?

spinbox 上下箭头事件_[React] 3 - 自动绑定 (事件绑定)相关推荐

最新文章

热门文章