如何在 React 中使用 map function 增加 id 標簽

Question

我有數組反應

[
{
  no:"s1",
  name:"abcd"
},
{
  no:"s1",
  name:"abcd"
}
]

我想使用 map function 在 UI 中呈現但是。 我希望 id 隨着 map 集成而增加

例如

<ul>
   <li id="1">
     {no}
     {name}
   </li>
  <li id="2">
     {no}
     {name}
  </li>
</ul>

Answer 1

你可以只使用數組index

const data = [
{
  no:"s1",
  name:"abcd"
},
{
  no:"s1",
  name:"abcd"
}
]
...
return <ul>
  {data.map((item, i) => <li key={i} id={i+1}>{item.no} {item.name}</li>)}
</ul>