Question

它似乎是根据控制台日志更新状态数组。我可能遗漏了渲染如何处理处理程序或生命周期本身（抱歉还在学习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>
    )
  }

当我刚刚添加单个元素（不是数组）时，我没有更新元素状态的问题，基本上从无到有。现在，我正在进入我的数组，我猜我的生命周期不会让我在页面首次加载时解决数组中的[0]索引？我确定我在这个DOM（虚拟DOM）生命周期中缺少一些订单操作。这对我来说都很新鲜。你如何处理添加状态数组对象（显然从一开始就没有）。

Answer 1

所以看起来我需要对map功能友好。我现在可以用这个回复东西。说得通。

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

相信这个参考资料，它使我了解我正在做的事情。

http://www.hackingwithreact.com/read/1/13/rendering-an-array-of-data-with-map-and-jsx

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

1 个答案: