は、ハード、それは例えば

Question

効率的であるならば、ここでハードコーディングを避けるために与えられたが、不明な点が反応しにマークアップをコーディング避けるためにしよう：

photos.map((photo, i) => { 
    return (
    <tr> 
     { 
     Object.keys(photo).map(j => 
      <td> 
      {photo[j]} 
      </td> 
     ) 
     } 
    </tr> 
); 
}); 

明らかにこれは、ハード、各列をコーディングするよりも優れているが、これは効率的ですか？これを行うより良い方法はありますか？

Answer 1

私はこれが良いと感じます。 2つのマップを別々のメソッドにリファクタリングすることはできますが、それは異なります。

ここにはexample from React docsがあり、動的項目にマップを使用する方法を示します。

ヒント：あなたは、私はそれが役に立てば幸いあなた<tr>と<td>

にkeysを追加することになるでしょう！