Reactjs React-状态数据现在显示在渲染中

它似乎正在根据控制台日志更新状态数组。我可能遗漏了一些关于渲染如何与处理程序或生命周期本身一起工作的信息（抱歉，仍然在学习React）。我是否应该将其发送到另一个组件，然后在我的页面上呈现该自定义组件？？下面是简化的代码

  handleRowSelect = (row, isSelected, e) => {
console.log("MYROW::", row);
console.log("MYSTATEROW1::", this.state.selected)
this.setState({ selected: this.state.selected.concat([row]) }, () => {
  console.log("MYSTATEROW2::", this.state.selected[0].ridername);
});
}


 render() {
   return (
     <h4>{this.state.selected[0].ridername}></h4>
    )
  }

handleRowSelect=（行，已选择，e）=>{
log（“MYROW:：”，row）；
console.log（“MYSTATEROW1:：”，this.state.selected）
this.setState（{selected:this.state.selected.concat（[row]）}，（）=>{
console.log（“MYSTATEROW2:：”，this.state.selected[0].ridername）；
});
}
render（）{
返回(
{this.state.selected[0].ridername}>
)
}

---

当我只是添加一个元素（不是数组）时，我在更新元素的状态时没有遇到任何问题，基本上从零变为一些东西。现在，我已经加入了我的数组，我猜我的生命周期不会让我在第一次加载页面时处理数组中的[0]索引？？我确定我在这个DOM（虚拟DOM）生命周期中缺少了一些订单操作。这对我来说都是新鲜事。如何处理添加状态数组对象时的渲染（从零开始）

看来我需要熟悉map函数。我现在可以用这个退东西了。有道理

 <div>{this.state.selected.map((selected, index) => (
            <p key={index}>{selected.ridername}</p>
          ))}</div>

{this.state.selected.map（（selected，index）=>(
{selected.ridername}
))}

这要归功于我所做的一切

---

添加

键

同时：

{selected.ridername}
而不是
{selected.ridername}
@AbdennourTOUMI是的，先生！我已经在使用那个索引了。我会更新我的答案。谢谢你的跟进。