ReactJS: Composition vs Inheritance - Thay cho sử dụng kế thừa

Thay cho sử dụng kế thừa

ReatcJS 2018

class PanelComponent extends React.Component {
  constructor(props){
    super(props);
  }
  render() {
    return (
      <div>
      {this.props.child1}
      {this.props.child2}
      </div>
    );
  }
}
 function Child1Component() {
   return(
     <div className="bg-danger">
        Component-1
     </div>
   );
 }
 function Child2Component() {
   return(
     <div className="bg-primary">
        Component-2
     </div>
   );
 }
ReactDOM.render(
  <PanelComponent child1={<Child1Component/>} child2={<Child2Component/>}/>,
  document.getElementById('root')
);