сделать уникальный номер для каждого элемента, который я получаю из ответа API

Question

Итак, здесь я пытаюсь отобразить ответ, полученный от API, перед тем, как получить элементы из API, я тестировал его статически и сделал уникальный идентификатор для каждого элемента, начиная с {1}и теперь я пытаюсь найти способ сделать какой-то цикл for для каждого элемента, который я получаю, чтобы дать каждому элементу уникальный идентификатор, начиная с {1}, как мне этого добиться?

<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 дает вам индекс, и вы можете использовать его для уникального идентификатора.Поскольку вы хотите, чтобы 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>

Answer 2

Функция карты фактически дает вам индекс в качестве второго параметра.

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