Question

我有一个API调用，在map函数中多次调用，以从 mongodb 中检索嵌套数据。

结果被推送到一个数组。该数组用作子组件的道具数据。

我可以console.log()生成的数组。但是我无法通过反应来访问它，或者通过它进行迭代。

有谁知道如何排序这个问题。它应该工作。我无法找到任何理由。它变得非常令人沮丧

fetchMemory(props) {
  const tempMemories = [];
  if (props.journey) {
    props.journey.memories.map((mem) = > {
      superagent
        .get(`/memories/$ {
          mem
        }`)
        .end(function (err, res) {
          let tp = res.body
          tempMemories.push(tp)
        });
    })
    this.setState({
      memories: tempMemories
    })
  }
}

我无法访问setstate中返回的内存数组。如果你在控制台中检查它们它们会出现它/它只是在子组件中返回一个错误（作为道具）。

＆＃34; TypeError：无法读取属性＆＃39;记忆＆＃39;未定义＆＃34;

提前致谢。

Answer 1

通过axios获取数据是异步的，因此在调用setState（）时基本上tempMemories将为空，因为网络调用尚未完成。

您应该像这样使用Promise.all：

const promiseList = props.journey.memories.map( mem => {
  return superagent
     .get(`/memories/${mem}`)
     .then( res => res.body );
});

Promise.all( promiseList )
  .then( results => {
    this.setState({
      memories: results
    });
  })
  .catch( err => {
    ...
  });

所以基本上你为每个元素创建了一个promise，然后等待所有元素被解析以进行setState()调用。

无法访问从api调用返回的对象数组

1 个答案: