Reactにテーブルマップのリストを正しく書き込むにはどうしたらいいですか？

Question

私はチュートリアルを読んでそれに従ってきましたが、私は時間をかけてコードを見てもそれを完全に理解していないようです。誰かがReactの地図を使ってテーブルを正しく書く方法について私に適切な説明をくれますか？

サンプル地図データ：

は、あなたたちは、私はだから、各パーツの良い説明と適切な例で私を助けることを願っ：私はそれはのように表示する方法

[{"location_id":1,"location":"HKG","description":"Hong Kong","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":2,"location":"KUL","description":"Kuala Lumpur","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0}] 

まだ現在でもドキュメントと混同されています。ありがとう。

Answer 1

テーブルの先頭を出力し、内容の配列をマップして終了を出力します。

function MyComponent(props) { 
    return (
    <table> 
     <thead> 
     <tr> 
      <th>ID</th> <th>Location</th> <th>Description</th> 
     </tr> 
     </thead> 
     <tbody> 
     { 
      props.data.map(row => (
      <tr> 
       <td>{row.location_id}</td> 
       <td>{row.location}</td> 
       <td>{row.description}</td> 
      </tr> 
     )) 
     } 
     </tbody> 
    </table> 
); 
}