Muy buenas a todos y espero me puedan ayudar, tengo un componente llamado **Contenido** el cual debe ser capaz de recibir para luego mostrar según la acción del usuario uno u otro componente, mi pregunta es, Cómo hago para mostrar un componente hijo dinámico y cuál seria la mejor práctica para ello?.

EL componente contenido es así según **React** en su parte de **Containment**:

<code>
import React, { Component } from 'react';
class Contenido extends Component {
  constructor(props){
    super(props)
  }
  render() {
    return (
      <div className="container-fluid">
        {this.props.children}
      </div>
    )
  }
}
export default Contenido
</code>

y esto es lo que tengo hasta ahora en el componente que importa al componente **Contenido**:

<code>
render () {
    return (
        < Contenido>
          < Publicaciones/>
        < /Contenido>
    )
  }
</code>

Cabe resaltar si se dan cuenta que dentro de **Contenido** paso otro componente llamado **Publicaciones**, la idea es pasar allí componente dinamicamente, por defecto seria **Publicaciones** pero imaginen que el usuario da click en un menú y debería de mostrarse otro componente allí.

Seria algo como asi:

<code>
render () {
    return (
        < Contenido>
          < Publicaciones/> 
          ó
          < OtroComponente/>
          ó
          < OtroComponente/>
          ó
          ...
        < /Contenido>
    )
  }
</code>

Espero me sepa explicar.