Tengo una función JS en mi código que se supone que devuelve un componente React para cada elemento de mi cadena dividida, pero por alguna razón, cuando la llamo en mi "retorno ()" principal, la función no devuelve nada. Traté de poner la función directamente dentro de return(), pero sucedió lo mismo. Eso nunca me había pasado antes y no tengo ni idea de lo que es.
Aquí está mi código:
import React from 'react'; import DatabaseLiLine from './DatabaseLiLine'; const DatabaseLiSection = ({ className, children, classId }) => { const example = "Use,This,As,An,Example"; const splitLiTitles = example.split(","); const returnLines = () => { splitLiTitles.forEach(element => { return( <DatabaseLiLine> {element} </DatabaseLiLine> ); }) } return ( <li className={className}> <a href="/">{children}</a> <div id={classId} className="consult_box"> {returnLines()} </div> </li> ); } export default DatabaseLiSection;forEach no devuelve nada. Cambie su código para usar el método de map .
const returnLines = () => { splitLiTitles.map(element => { return( <DatabaseLiLine> {element} </DatabaseLiLine> ); }) } Tener un poco de pedo cerebral aquí, pero olvidé si también necesita devolver el método del mapa, como agregar return antes splitLiTitles.map... . Creo que debería funcionar sin él, pero si no lo hace, intente agregar ese retorno al frente también.