Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Meu sobre mim e os posts não aparecem

![](Insira aqui a descrição dessa imagem para ajudar na acessibilidade )

import PostModelo from "componentes/PostModelo";
import fotoCapa from "assets/sobre_mim_capa.png";
import fotoSobreMim from "assets/sobre_mim_foto.png";
import styles from './SobreMim.module.css'; // 

export default function SobreMim(){
  return(
    <PostModelo
      fotoCapa={fotoCapa}
      titulo="Sobre Mim"
    >
      <h3 className={styles.subtitulo}> 
        Olá, sou Alessandra!
      </h3>
      <img 
        src={fotoSobreMim} 
        alt="Uma foto minha, Alessandra, sorrindo" 
        className={styles.fotoSobreMim} 
      />
        <p className={styles.paragrafo}>
         Olá! Sou Alessandra e estou embarcando em uma jornada fascinante no mundo da programação.
         Sempre fui apaixonado(a) por tecnologia e a ideia de criar algo do zero me fascina. 
         </p> 
         <p className={styles.paragrafo}>
            Comecei a estudar frontend há 1 ano e estou adorando cada passo dessa jornada.
         Meu objetivo é me tornar um(a) desenvolvedor(a) full stack.
         </p>
        className={styles.paragrafo}
         <p className={styles.paragrafo}>
           Olá! Sou Alessandra e estou embarcando em uma jornada fascinante no mundo da programação.
         Sempre fui apaixonado(a) por tecnologia e a ideia de criar algo do zero me fascina. 
         </p>
         <p className={styles.paragrafo}>
          Comecei a estudar frontend há 1 ano e estou adorando cada passo dessa jornada.
         Meu objetivo é me tornar um(a) desenvolvedor(a) full stack.
         </p>

    </PostModelo>
  );
}

código do git: https://github.com/AlessandraSantanna/ola-mundo.git

2 respostas

Bom dia Alessandra, tudo bom?

Em react, quando chama um componente, ele recebe o parâmetro props

export default function Exemplo(props){
   // Código omitido
}

No componente PostModelo, ti está esperando 3 propriedades que passa como atributo da seguinte maneira:

export default function PostModelo(fotoCapa,titulo,children){
   // Código omitido
}

A minha recomendação para corrigir esse problema seria receber o props e utilizar as chaves para acessar cada um dos itens que precisa ou fazer uma decomposição.

Com props:

export default function PostModelo(props){
   const fotoCapa = props.fotoCapa;
   const titulo = props.titulo;
   const children = props.children;
    
    // Código omitido
}

Com decomposição:

export default function PostModelo({ fotoCapa, titulo, children }){
   // Código omitido
}
solução!

Funcionou. Obrigada!