マッピングされた配列のレンダリングテキストを反応させない

Question

現在、iTunes APIからのリストをレンダリングし、それらのすべてをページに表示しようとしています。 24行目https://gist.github.com/JelaniThompson/bd5d9127b80641b4483b9273f97df289

が、私は私のディスプレイ変数を定義し、return文でそれをレンダリングするが、それは表示されない：

は、ここに私のコードです。しかし、コンソールに同じ値を記録すると、すべてのショー名が表示されます。

ページに配列の値を表示する正しい方法は何ですか？

Answer 1

確かにそれはありません！ これは、ファーストネームが空の配列であるためです。

ソリューション：

1-クラスにこれを追加し、名前を削除、画像、ファイルの先頭から要約：

constructor(props){ 
    super(props) 
    this.state = { 
    names : [], 
    images : [], 
    summaries : [] 
    } 
} 

2-呼び出し、コンストラクタ内のデータを取得し、それを削除renderメソッドから（あなたは、レンダリング内部レンダリングあなたが無限ループを持つことになります呼び出すすべてのことを行うべきではありません！）：

constructor(props){ 
      super(props) 
      this.state = { 
      names : [], 
      images : [], 
      summaries : [] 
      } 

      let that = this 
      fetch(topFifty).then(function(response) { 
        return response.json().then(function(json) { 
         let names = [], images = [], summaries = [] 
         json.feed.entry.forEach(function(datum) { 
          names.push(datum["im:name"].label) 
          images.push(datum["im:image"][0].label) 
          summaries.push(datum.summary.label) 
         }) 
         that.setState({names:names, 
             images: images, 
             summaries: summaries}) 
        }) 
      }) 
    }