React Acordion
O Projeto foi desenvolvido com base dos dados abaixo:
Vídeo:
Screenshot:
Estrutura desenvolvida objeto db.json
[{
"id": "a853dddc-b639-41e6-a876-958b1e7f65d1",
"name": "Harald Svante August",
"level": 1,
"children": []
}]Comportamento:
- Para cada item, o usuário deve poder marcar o checkbox dessa linha.
- Para cada item que tenha filhos (ou seja, um item pai), quando o usuário marcar ou desmarcar o checkbox, o estado deve ser cascateado a todos os seus descendentes.
- Para cada item que seja um item pai, o usuário deve ser capaz de mostrar ou esconder os itens internos.
Liberdade:
- Você pode usar qualquer tecnologia que melhor lhe servir.
- Você é livre para estruturar o projeto da maneira que achar mais organizada.
- Você é livre para implementar o código em qualquer padrão que achar mais adequado.
- Você pode adicionar funcionalidades ao componente como desejar, mas não fuja da simplicidade.
Nós valorizamos atenção para os seguintes pontos:
- Acoplamento e coesão
- Testes
- Performance
- Recuperação de estado (por exemplo: recuperar estado dos checkboxes após um page refresh)
- Experiência do usuário (área de clique, scroll jump, etc.)