Entrar Ainda não tem acesso?
1
resposta

Usar 'class' ou não?

Referente ao curso React parte 1: Componentes reutilizáveis para sua webapp, no capítulo Usando componentes e atividade Primeiro componente

por Marcelo Palma de Noronha
| 161.7k xp | 158 posts

No curso de React dado pelo instrutor Alberto ele usava isso:

const TableHead = () => {
    return (
    <thead>
        <tr>
            <th>Autores</th>
            <th>Livros</th>
            <th>Preços</th>
            <th>Remover</th>
        </tr>
    </thead>
    );
}

Assim:

class TableHead extends Component {
    return (
    <thead>
        <tr>
            <th>Autores</th>
            <th>Livros</th>
            <th>Preços</th>
            <th>Remover</th>
        </tr>
    </thead>
    );
}

Qual a diferença entre as duas versões?

1 resposta
por Daniel Omnion
| 1014.4k xp | 1150 posts

O primeiro exemplo, que é o "const TableHead = () => {}" é uma função javascript que retorna um conteúdo JSX. No React isso é chamado de Function Component

Já o outro exemplo, é um componente (uma classe que herda React Component). Como o seu component não possui state, esse componente que você criou é chamado de Stateless component.

Ambos os exemplos fazem a mesma coisa.

Se você usar uma ferramenta de LINT para validar o seu código (o ESLint é algo comum de usar junto como React) ele vai recomendar o primeiro exemplo, por razões de desempenho.