将更新的对象和对象保存在本地存储的数组中

时间:2020-05-31 00:14:09

标签: javascript

我正在做一个待办事项清单。这是构建我的待办事项列表项的函数:

function createTodoElement(todo) {
    //todo div
    const todoDiv = document.createElement('div');
    todoDiv.classList.add('todos');

    //complete btn
    const completeBtn = document.createElement('button');
    completeBtn.setAttribute('data-id', todo.id);
    completeBtn.classList.add('complete-btn');
    completeBtn.innerText = ('o(-_-)o');
    completeBtn.onclick = completeTodo;


    //todo content
    const todoContent = document.createElement('div');
    todoContent.innerText = todo.content;
    todoContent.classList.add('todo-content');

    //delete button
    const deleteBtn = document.createElement('button');
    deleteBtn.setAttribute('data-id', todo.id);
    deleteBtn.classList.add('todo-delete-btn');
    deleteBtn.innerText = 'X';
    deleteBtn.onclick = deleteTodo;

    todoDiv.appendChild(completeBtn);
    todoDiv.appendChild(todoContent);
    todoDiv.appendChild(deleteBtn);

    return todoDiv;
}

,我正在尝试将待办事项的内容更新为“完成”,并将完成的状态更新为“真”,但对于我来说似乎并不完全可行。这是我的功能:

function completeTodo(e) {
    const btn = e.currentTarget;
    btn.innerText = '\\(^_^)/';

    let targetId = (btn.getAttribute('data-id'));

    console.log(targetId);

    let hasId = ls.getTodoList();

    let item = hasId.find(obj => obj.id == targetId);

    item.content = "done";
    item.completed = 'true';

    localStorage.setItem('content', JSON.stringify(item.content));    
}

我的对象看起来像这样:array [{id:23435352,内容:'make soup',完成:'false'},{id:48283749,内容:'study',完成:'false'}] < / p>

一切似乎都可以,但是将新数据更新到语言环境存储中。我还想保存新按钮的内部文本。要实现此功能,我需要更改什么功能?

0 个答案:

没有答案