You may not that with in the opening and closing tags of a component there can be other tag like div can contain table, list etc. By default React component hide all the components within.

So how to render the children ?

functional component

In the functional component at the end of the render section add 

..... return ( <div> {props.children} </div>  )

Class component

In the class component we have to use the this for accessing the props

..... return ( <div> {this.props.children} </div>  )
 This free site is ad-supported. Learn more
​