Olá!
Então, como gostei bastante do curso decidi criar uma nova funcionalidade, quando o usuário clica no botão de check na esquerda da tarefa cadastrada, ele consegue tornar ela concluída, assim como ele também consegue clicar novamente e torná-la ativa.
O problema mora na hora de salvar isso no localstorage, tentei utilizar o tarefa.completa para adicionar ao objeto tarefa o atributo concluida, mas por algum motivo o if antes do onclick não reconhece isso e quando recarrego a página as tarefas concluídas não aparecem concluídas, apenas como UNDEFINED.
Segue meu código:
if (tarefa.completa) {
li.classList.add('app__section-task-list-item-complete')
botao.setAttribute('disabled', 'disabled')
} else {
li.onclick = () => {
document.querySelectorAll('.app__section-task-list-item-active')
.forEach(elemento => {
elemento.classList.remove('app__section-task-list-item-active')
})
if (tarefaSelecionada == tarefa) {
paragrafoDescricaoTarefa.textContent = ''
tarefaSelecionada = null
liTarefaSelecionada = null
return
}
tarefaSelecionada = tarefa
liTarefaSelecionada = li
paragrafoDescricaoTarefa.textContent = tarefa.descricao
li.classList.add('app__section-task-list-item-active');
}
svg.addEventListener('click', () => {
if (li.classList.contains('app__section-task-list-item-complete')) {
li.classList.remove('app__section-task-list-item-complete')
tarefa.completa = false
}
else {
li.classList.remove('app__section-task-list-item-active')
li.classList.add('app__section-task-list-item-complete')
botao.setAttribute('disabled', 'disabled')
tarefa.completa = true
atualizarTarefas();
}
})
li.append(svg)
li.append(paragrafo)
li.append(botao)
return li
}}