您的位置:首页 > Web前端 > React

react事件绑定--不再需要bind啦(es6)

2017-08-06 11:28 501 查看

react事件绑定–不再需要bind啦(es6)

今天看到网友提到在react的render函数中不建议使用bind绑定方法,因为这样每次render都会进行一次bind操作消耗性能.

下面用到的这个方法结合es6就可以摆脱bind的绑定问题,不多说,直接上代码

代码

代码块语法遵循标准markdown代码,例如:

class Test entends React.Component {
constructor () {
super();
this.state = {};
};
// 带参数的事件绑定
handleClick = (params) => {
console.log(params);
};
// 不带参数的事件绑定
click =()=> {
console.log('可以直接拿到this:'+this);
}
render () {
return {
<div>
<div onClick={ e => {this.handleClick(params)} }>绑定</div>
<div onClick={ this.click }>绑定</div>
</div>
};
};
}


结合es6并不需要在this.state中声明this.click就可以拿到this,但是handleClick和click方法必须要箭头函数声明,普通方法不可以像这样:click () { console.log(this) };

第一次写博客,有啥写的不好或者不对的地方,欢迎一起讨论!共同成长!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  react react事件绑定