Reactjs 如何检索for循环组件的索引

我有一个提供者，它将返回我需要渲染的元素列表。此列表中的每个项目旁边都必须有一个按钮，该按钮将根据所选元素执行某些操作。我是这样渲染此视图的：

render(){
  <div name="enclosing div">
    {this._renderList()}
  </div>
}

_renderList(){
  var result = [];
  var i = 0;
  for (i; i < this.mylist.length; ++i) {
    result.push(<p> {this.myList[i]} </p>);
    result.push(<Button onClick={ () => this.clicked(params) } />);
  }
  return result;
}

render（）{
{this.\u renderList（）}
}
_renderList（）{
var结果=[]；
var i=0；
对于（i；i）；
result.push（this.clicked（params）}/>）；
}
返回结果；
}

在我的点击处理程序中，我需要标记中的信息。我认为这种方法会奏效：

<Button onClick ={() => this.clicked(i)} />

this.clicked（i）}/>

但是当我这样做时，I在单击时总是=mylist.length

接下来，我想让我的按钮保存一个键属性，如下所示：

<Button index={i} onClick = {...} />

但我意识到我不知道如何将I从索引传递到onClick。我该怎么做

---

我是不是一开始就错了？你也可以这样写：

render(){
  <div name="enclosing div">
    {this._renderList()}
  </div>
}

_renderList(){
  var result = [];
  for (let i = 0; i < this.mylist.length; i++) {
    result.push(<p> {this.myList[i]} </p>);
    result.push(<Button onClick={this.clicked.bind(this,params)} />);
  }
  return result;
}

key在react中是一个非常特殊的属性，因为当您试图显示一组组件时，他们会使用它，我不确定您是否可以使用道具访问它，或者是否必须通过迂回的方式访问它。我可能会使用像

index

这样的其他东西，然后在子对象中请求

this.props.index

。感谢这一点，直到尝试您的代码片段，我才意识到在for循环之外初始化for循环计数器是我的问题的根源。