React Native 嵌套箭头函数和普通箭头函数的区别

Question

let arr;
for (var i = 0; i < 4; i++) {
  arr.push(
    <ListItem key={i}> // native-base component
      <Button
        onPress={this.pick(curJob, i)}>
      </Button>
    </ListItem>
  )
}


render(){
  return (
    { arr }
  )
}

在这段代码中，这两个函数有什么区别？

功能 1.

pick = (job,index) => {
  console.log(job);
  console.log(index);
}

功能 2。

pick = (job,index) => () => {
  console.log(job);
  console.log(index);
}

我发现函数 2 工作正常，但函数 1 返回错误（超出最大调用堆栈大小）我想知道这两个函数之间有什么区别，以及函数 1 是否可以称为回调函数。

Answer 1

第二个无效。

箭头函数的原型如下：

variableName = (arguments) => {
    Body
}

你的onPress应该是： onPress = {() => this.pick(curJob,i)}> ，否则，每次渲染发生时都会调用该函数，所以总是如此。 使用() =>之前，您是在告诉程序仅在this.pick运行this.pick

Answer 2

 pick = (job,index) => () => {
                console.log(job);
                console.log(index);
           }

这只是返回一个函数的函数，它等于

nestedfunc(job, index) => {
  console.log(job);
  console.log(index);
}


pick = (job,index) => nestedfunc(job,index);