reactjs - React - ¿el componente no se renderiza en un bucle foreach?

Tengo una pequeña aplicación cuando abres una pestaña el React Route redirige al componente dado (contenedor). Y desde el contenedor quiero renderizar los componentes hijos. Uso el bucle foreach para recorrer una lista que tiene las props que necesitan ser dadas al hijo. Sin embargo, el hijo no se renderiza.

No quiero usar map porque uso bibliotecas que dependen de la clase lista.

render() {   
    return ( 
        <div>
            {this.state.list.ForEach((element) => 
                <ChildComponent childName={element.name} 
        }
        </div> 
    );
}

}

Respuesta #1

Estás confundiendo Array.forEach con Array.map. forEach no devuelve nada. La forma correcta es:

<div>
    {this.state.list.map((element, index) => 
        <ChildComponent key={index} childName={element.name} />
    )}
</div> 

map convierte el element dado en otro elemento, un componente en este caso. El resultado de llamar a map es un arreglo de componentes que luego se renderiza. forEach siempre devuelve undefined, por lo tanto, el resultado de tu código es el mismo que escribir:

<div>
   {undefined}
</div>

Tenga en cuenta que key también es necesario al renderizar listas de componentes.