react中组件处理事件最容易出错是事件处理函数中的this的指向问题,因为ES6 class并不会为方法自动绑定this到当前对象.React实力函数的写法主要有三种形式,不同的写法解决this指向问题的方式也不同.
1.使用箭头函数,这种写法每次render调用时,都会重新创建一个新的组件,带来额外的性能开销.
不传参
传参
2.使用组件方法,直接将方法赋值给元素的事件属性,并在构造器中将方法bind到当前对象.这么写的好处是每次render不会重新创建一个回调函数,但是如果有很多个函数,那构造器里就写很多行,另外,传参的时候,也是使用的箭头函数,也是每次render就会床创建函数
不传参
传参
3.属性初始化语法(property initializer syntax),不用在构造器中手动绑定this,也没有render重复渲染的新更能问题,但是怎么传参呢?
不传参