2017-10-15 8 views
2

React Routeが特定のコンポーネント(コンテナ)にリダイレクトするタブを開くと、小さなアプリケーションがあります。そして、コンテナから、子コンポーネントをレンダリングします。私はforeachループを使用して、子に与えられる必要のある小道具を持つリストを調べます。しかし、子供はレンダリングされません。リアクションコンポーネントはforeachループでレンダリングされませんか?

リストクラスに依存するライブラリを使用しているため、マップを使用したくありません。

render() { 
    return ( 
     <div> 
      {this.state.list.ForEach((element) => 
       <ChildComponent childName={element.name} 
     } 
     </div> 
    ); 
} 

}

答えて

7

あなたはArray.mapArray.forEachを混乱されています。 forEachは何も返しません。正しい方法は次のとおり

<div> 
    {this.state.list.map((element, index) => 
     <ChildComponent key={index} childName={element.name} 
    } 
</div> 
map

が別の要素に与えられたelement、この場合成分に変換します。 mapを呼び出した結果は、レンダリングされるコンポーネントの配列です。

<div> 
    {undefined} 
</div> 

注コンポーネントのリストをレンダリングするときkeyも必要であること:forEachは常にそれゆえ、あなたのコードの結果は、書き込みと同じであるundefinedを返します。

関連する問題