How to give a place for content to a React component?

Question

React

Let's say we have a SectionContainer React component that renders

<section>
    <h3></h3>
    <article></article>
    <div></div>
</section>

And it is used in the following form:

<SectionContainer>
    <SectionContent />
    <SectionExtraContent />
</SectionContainer>

How do I tell the SectionContainer that the content should be inserted inside the article 'I', and not in the h3 or div 'a?

Answer 1

https://reactjs.org/docs/composition-vs-inheritanc...

// если это классовый компонент, а не функция
<section>
    <h3></h3>
    <article>{this.props.children}</article>   
    <div></div>
</section>