DRodrigues17/aulas-react

Correção Exercício 1.8.1

Opened this issue · 0 comments

Correção

Você deve criar dois botões, um para que sejam listados todos os personagens que são da família Redfield e um botão para que sejam listados todos os personagens da família Baker.

Nota: 10 parabéns 🥳

Comentários

Na linha 28 você faz uso da tag li.

<li>{listaPersonagem}</li>

Porém, na implementação do seu onClick o map já está retornando um component JSX do tipo li. Isso faz com que o resultado final da sua aplicação seja um li dentro de um li. Seria mais adequado que seja apenas um nível.

Além disso, você possui lógica duplicada entre os handlers. Seria uma boa fazer uma função que removesse essa duplicidade. Na sua aplicação essa duplicidade é tão pequena que não seria necessário removê-la, porém em uma aplicação mais complexa isso seria necessário.

const gerarLista = (_personagens, _nome) => {
  return _personagens
    .filter((personagem) => personagem.includes(_nome))
    .map((personagem) => <li>{personagem}</li>)
}