如何使用JSX重复数组n次

Question

我在我的应用程序中使用React / JSX。

我需要第一次从API中重新获取数据。如果我点击按钮，它会再次出现n次。另一次点击 - ＆gt;另外n次reapet一遍又一遍。 api每次给我1个结果。我可以在必要时定义结果

我的代码：

 const n=2;

 arr:[];


handleClick(){
//i need the code to increase n another 2 times
}



//the array here without the code to fill api data. not relevant
 this.state.arr.map((d,key)=>
<span>age: {d.age} </span>


<button onClick={this.handleClick} >

第一批结果中的预期结果：

年龄：20

年龄：24

单击按钮后

：

年龄：20

年龄：24

年龄：48

年龄：19

Answer 1

取决于您的API调用的位置，但为了更新数组，您应该在this.setState

中使用handleClick

handleClick() {
  this.setState({
    arr: this.state.arr.concat(newContentArray)
  })
}

不知道如何获取数据，但这是一般原则。使用新数据获取现有的this.state.arr和concat数组。

请务必在bind事件处理程序中使用button或箭头功能。