javascript - React Native 组件回调函数

Question

在组件中，我见过不同的回调方式。有什么区别:

<MyButton onPress={ () => {doSomething(data)} }>

和

<MyButton onPress={ this.doSomething.bind(this) }>

Answer 1

<MyButton onPress={ () => {doSomething(data)} }>

这个代码块使用了 ES6 的 Arrow 函数；这是在 javascript 中声明函数的另一种方式。另外，this的范围在箭头函数中取决于函数的创建位置，而不是 this 的正常范围规则默认情况下取决于函数的调用方式。

<MyButton onPress={ this.doSomething.bind(this) }>

这条语句调用了doSomething方法。但是由于事件注册是在不同的元素上完成的，doSomething 的范围不同，使用 bind 强制绑定(bind)javascript 中的方法。

此外，在第二种方法中，您没有传递数据参数，您可以使用第二个参数将其传递给该方法，如下所示。

<MyButton onPress={ this.doSomething.bind(this, data)} }>