How to use props children in react?

How to create react children component?

We create a component as <Header /> this is self close so it’s have already render data but if we create a component as <Header> … </Header> then it needs to use inner content so this is a props.children type component. As below code example:

import React from 'react'

export default (props) =>

<div className={props.cls}>

    <div className="abc">

         {props.children}

    </div>

</div>

   

Otherpage.js

import Wrapper from '../../components/wrapper'

export default () =>

    <>

    <Wrapper cls="homeSection"><WelcomeContetn /></Wrapper>

    <Wrapper cls="sidebarSection">

      <div className="text-center">

 <div> Your dummy content</div>

      </div>

    </Wrapper>

 </>