文章详情页
javascript - React中组件绑定this
浏览:63日期:2023-05-05 18:28:44
问题描述
<button onClick={this.handleEvent}> //这里的this是toggle组件 为什么还需要在组件里绑定这个函数的this {this.state.isToggleOn === true ? ’on’ : ’off’}</button>
想不明白这里的this绑定
问题解答
回答1:因为在class中声明函数,并不会自动绑定this对象
所以,你在onClick={this.handleEvent}的时候,分解成两步你就懂了:
let handleEvent = this.handleEvent;...onClick={handleEvent}...
所以,onClick调用的时候,handleEvent中的this会是undefined(根据文档)
所以,你需要bind一下, 那么里面的this就是当前组件啦。
还有一种方便的写法,就是用箭头函数声明:
handleEvent = (e)=>{}render(){ ...onClick={this.handleEvent}...}回答2:
因为handleEvent中this.setState...的this并没有绑定this
可以采用箭头函数的语法糖来绑定this
handleEvent = () => { this.setState...}
标签:
JavaScript
相关文章:
1. javascript - 修改表单多选项时和后台同事配合的问题。2. mysql - 索引过滤性不好是由什么原因引起的,应该怎么解决3. 网页爬虫 - Python:爬虫的中文编码问题?4. dockerfile - [docker build image失败- npm install]5. angular.js - angularjs 怎么封装 upload 上传6. android - Listview模仿朋友圈点赞的TextView没有刷新?7. javascript - H5页面怎么查看console信息?8. docker内创建jenkins访问另一个容器下的服务器问题9. tornado - python使用yield是否能保证协程的顺序性?10. javascript - vue生成一维码?求助!!!!!急
排行榜
