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);