Javascript React render-由于计时原因，无法访问阵列数据

我有一个函数，需要花费时间获取数据。当第一次返回render时，数据

this.state

不可用，因此，基于许多其他类似的问题，我尝试使用三元组，并在数据准备好后重新渲染。我使用setState的回调版本：

 this.setState(prevState => ({ comments: [...prevState.comments, top100Resolved ] }))

当使用setState返回数据（数组）时，我无法访问它。目标是映射到它并将其推送到模板中，但我甚至无法索引到它中。这是渲染

render(){
//true once there is some state
   let bool = this.state.comments.length

      return (
        <div className="data">
        {
            bool ? 
    //Want to render markup here
          this.state.commments.map(comment => {
     <div>comment</div>  //nothing happens
      })
           : <div>Not ready</div> 
        }

      </div>)
  }

render（）{
//一旦出现某种状态，则为真
设bool=this.state.comments.length
返回(
{
布尔？
//要在此处呈现标记吗
this.state.commments.map（注释=>{
注释//什么也没发生
})
：没有准备好
}
)
}

第一个

未就绪

将出现。 但是，即使

bool

为真并且我返回

[Array（0）]

，我也无法索引到它<代码>[Array（0）][0]生成对象数组

[]

<代码>[Array（0）][0][0]应该是一个对象，但未定义。因此映射功能当前不可用

---

您将ID映射到承诺的方式不正确。您所做的只是为每个ID设置承诺，而不是等待它完成。相反，请使用

promise。所有
并放弃整个承诺映射阶段：

Promise.all(top100Promises.map(id => {
  return this.getStory(id).then(obj => {
    if(obj) {
      if(obj.type === 'comment') {
        return obj
      }
    }
}))
  .then(comments => {
    this.setState(prevState => ({ 
      comments: [...prevState.comments, ...comments.filter(o => o)] // this filter removes non-comments that are undefined 
    }))
  })

这将在设置状态之前等待每个注释进入，而不是在任何注释进入之前设置状态。您还可以将
top100承诺
代码缩短为：

let top100Promises = Array.from({ length: 100 }, (_, i) => maxNum - i)

请参阅。
为什么该功能需要时间？它是否可以异步执行任何操作，比如通过internet获取内容？@kumarmo2已更新，告知它用于获取。请尝试将注释类型更改为空数组，如下所示。评论：[]