0

Puedo crear componentes como:

const Route = ({url,clase,contenido}) => { <a className={clase} href={url}>{contendido}<a/>}

Y posteriormente hacer lo siguiente:

Class App extends Component {
  render() {
    return (
      <Route
        url={una_url}
        clase={una_clase}
        contenido={<i class="fa fa-users">Clikeame<i/>}
      />
     );
   }
  }

Pero el contenido no deberia de ir de esa forma, deberia ser algo asi.

Class App extends Component {
  render() {
    return (
      <Route
        url={una_url}
        clase={una_clase}
      >
         <i class="fa fa-users">Clikeame<i/>
      <Route/>
     );
   }
 }

Que debo de hacer para llegar a este resultado?

const Route = ({url,clase}) => { <a className={clase} href={url}>...que debo de hacer aqui? <a/>}

1 respuesta 1

2
{props.children}

Cualquier cosa que esté dentro de un componente hasta su cierre es un nodo hijo.

<Padre> <Hijo /> </Padre>

Usted debió haberse dado cuenta que está intentando crear un HOC. High Order Component, y de esta manera no está haciendo un correcto retorno del mismo.

function Route(props){
    const { url, clase, children } = props;
    return (<a className={clase} href={url}> {children} <a/>)
}

Le invito a usar más a menudo la instrucción function para crear sus componentes.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.