Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Função concluirTarefa não está "riscando" a tarefa

Olá, já revisei o código, mas não estou encontrando o que pode estar causando esse não funcionamento do botão concluirTarefa. Apesar do botão mudar de cor no click, ele não está riscando a tarefa. Segue código do JS. Não fiz nenhuma modificação no CSS

const criarTarefa = (evento) => {

    evento.preventDefault()

    const lista = document.querySelector('[data-list]')
    const input = document.querySelector('[data-form-input]')
    const valor = input.value

    const tarefa = document.createElement('li')
    tarefa.classList.add('task')

    const conteudo = `<p classe="content">${valor}</p>`

    tarefa.innerHTML = conteudo;

    tarefa.appendChild(botaoConclui())
    lista.appendChild(tarefa)
    input.value = " "
}

const novaTarefa = document.querySelector('[data-form-button]')

novaTarefa.addEventListener('click', criarTarefa)

const botaoConclui = () => {
    const botaoConclui = document.createElement('button')

    botaoConclui.classList.add('check-button')
    botaoConclui.innerHTML = 'concluir'

    botaoConclui.addEventListener('click', concluirTarefa)

    return botaoConclui
}

const concluirTarefa = (evento) => {
    const botaoConclui = evento.target

    const tarefaCompleta = botaoConclui.parentElement

    tarefaCompleta.classList.toggle('done')

}
2 respostas
solução!

Oi, José!

Ali na declaração de const conteúdo (8º linha do código) você escreveu "classe" ao invés de "class". Por algum motivo, que eu não sei explicar, a parte de adição de itens funciona normalmente, mas você não consegue riscar a tarefa, conforme testei aqui. Espero ter ajudado!

Obrigado Vinicius... Realmente, deu certo!