Instruções

Passo 11

Você deve ver agora um único cartão exibido na página. Mas falta uma parte dentro do componente Card. Como você se lembra das lições anteriores, é uma boa prática incluir uma prop key ao renderizar uma lista de componentes assim:
<div>
  {fruits.map(fruit => (
    <Card
      key={fruit.id}
      name={fruit.name}
      color={fruit.color}
    />
  ))}
</div>
A prop key ajuda o React a identificar quais itens foram alterados, adicionados ou removidos. Isso melhora o desempenho e permite atualizações mais eficientes. Atualize o componente Card para incluir uma prop key com o valor de profile.id.

O que fazer:

Testes:

  • Você deve adicionar uma prop `key` ao componente `Card`. O valor deve ser `profile.id`.

Preview