は、API呼び出しから返されたオブジェクトの配列にアクセスすることができません。

Question

マップ関数内で複数回呼び出されて、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で返されたメモリの配列にアクセスできません。コンソールでそれらを調べると表示されます。子コンポーネント（小道具）にエラーが返されます。

"TypeError: Cannot read property 'memories' of undefined"

ありがとうございます。

Answer 1

axison経由のデータ取得は非同期なので、ネットワークコールがまだ完了していないため、基本的にtempMemoriesはsetState（）の呼び出しで空になります。だから、基本的には、各要素に対して1つの約束を作成

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 => { 
    ... 
    }); 

をしてからsetState()コールを行うことを決議得るためにそれらのすべてを待つ：

あなたはこのようPromise.allを使用する必要があります。