Question

因此，在这里，我试图通过API的响应进行映射，在从API获取项目之前，我已经对其进行了静态测试，并且为从{1}开始的每个项目都创建了唯一的编号ID现在，我正在尝试寻找一种方法，使我得到的每个项目都具有某种for循环，并为每个项目提供一个从{1}开始的唯一编号id，我该如何实现？

<div className="items">
  {this.state.items.map(i =><a href="/" id={1} onClick={this.targetValue} className={this.state.selected === "1" ? "selected" : ""}>{i.name}</a>
</div>

Answer 1

map函数实际上为您提供了索引作为第二个参数。

<div className="items">
  {this.state.items.map((i, idx) =><a href="/" id={idx} onClick={this.targetValue} className={this.state.selected === "1" ? "selected" : ""}>{i.name}</a>
</div>

Answer 2

.map为您提供索引，您可以将其用于唯一ID。由于您希望ID从1开始，因此您需要索引+1，因为索引从0开始

  <div className="items">
       {this.state.items.map((i, index) => <a href="/" id={index+1} onClick={this.targetValue} className={this.state.selected === index +1? "selected" : ""}>{i.name}. </a>
  </div>

为我从api响应中获得的每个项目设置唯一的编号ID

2 个答案: