React.Fragment
要素を使うとどうしてもネストしなければ表現できないような構造時にラップする要素として使えます。この要素は何も HTML 要素を生み出しません。
この要素は要素として特別に扱われ、<>
と</>
で囲む方法が許されてます。
<>
contents1
contents2
>
このコードは実際には以下のような結果となります。
contents1
contents2
属性を渡したい
ただ<></>
では属性を渡すことはできません。例えば代表的なものにkey
属性があります。その場合は普通にReact.Fragment
を要素として使います。
{[...Array(5)].map((_, i) => {
return (
contents1
contents2
);
})}