Por que usar o método toggle ao invés de remove nesse trecho do código:
btnAdicionarTarefa.addEventListener('click', () => {
formAdicionarTarefa.classList.toggle('hidden')
})
btnAdicionarTarefa.addEventListener('click', () => {
formAdicionarTarefa.classList.remove('hidden')
})
Oii, Jeferson!
Ótima pergunta! Vamos entender a diferença entre usar toggle e remove nesses contextos.
O método toggle é utilizado para alternar a presença de uma classe em um elemento. No seu exemplo, formAdicionarTarefa.classList.toggle('hidden') vai adicionar a classe 'hidden' se ela não estiver presente e removê-la se ela já estiver. Isso é útil quando você quer que um elemento apareça e desapareça com base em uma interação, como um clique, funcionando como um interruptor.
Por outro lado, o método remove simplesmente remove a classe especificada do elemento, se ela estiver presente. No seu exemplo, formAdicionarTarefa.classList.remove('hidden') vai apenas garantir que a classe 'hidden' seja removida, tornando o elemento visível, mas não alternará o estado de visibilidade.
Então, se queremos alternar entre mostrar e esconder o formulário a cada clique, toggle é a escolha ideal. Se a intenção é apenas garantir que o formulário seja mostrado (ou seja, remover a classe 'hidden'), então remove seria mais apropriado.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!