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

[Dúvida] Diferença na chamada de props

Gostaria de saber qual o melhor caso de uso e porque existe a diferença de chamada de props, ex: props e {props}

2 respostas
solução!

Fala Ketlen, bom imagino que você esteja falando do uso da props dentro de um componente React. Essa sintaxe pegando com as chaves {}, te permite desestruturar as propriedades, isso é, ao invés de receber o objeto props com as propriedades dentro, você pode pegar diretamente cada propriedade. Na minha opinião isso deixa o código mais legível e mais fácil de trabalhar, pois você consegue saber exatamente quais as propriedades você pode utilizar, vou deixar um exemplo com e sem essa estratégia aqui abaixo.

SEM UTILIZAR DESESTRUTURAÇÃO

export const MeuComponente = (props) => {
  return (
    <>
      <p>{ props.titulo }</p>
      <p>{ props.texto }</p>
    </>
  )
}

COM DESESTRUTURAÇÃO

export const MeuComponente = ({ titulo, texto }) => {
  return (
    <>
      <p>{ titulo }</p>
      <p>{ texto }</p>
    </>
  )
}

Percebe que no segundo exemplo, eu não preciso ficar repetindo o props. para acessar as propriedades.

Espero ter conseguido ajudar!!

Muito obrigada mesmo, Jean! Me esclareceu bastante.