Reactで複数のchildrenを扱いたい場合の実装パターン

導入：Reactのchildren Reactのchildrenを使うことで、子要素をwrapするような子要素を記述することが出来る。railsのviewで言えばyieldみたいなもの。 const SomeLabel = ({children}) => { return <div>{children}</div> } // 呼び出し側 <SomeLabel> // 子要素の拡張に対して、`SomeLabel`は関心を持たなくて良い。 <SomeDecoration>Hello</SomeDecoration> <SomeLabel> これを覚えるとだいぶReactをきれいに書きやすくなるイメージがある。 本題：複数の子要素を柔軟に扱いたいときにどう考えるか？ 例えば何かtitle, author,bodyを貰って記事を表示するような<Post>を考える。

[stibbar]

https://maku.blog/p/xenv4bh/