Question

我正在处理一个待办事项列表分配，它基本上由一个用户能够创建一个列表和在该列表中他将能够创建待办事项组成。我正在研究从给定列表中删除待办事项的功能。现在我可以通过遍历每个列表来实现它，找到用户想要删除的 Todo 项目的匹配 Id，获取该项目的索引并使用 Splice() 方法将其从原始数组中删除，所有这些都很好，效果很好，但我担心的是，即使找到了 ID，初始 ForEach 迭代也会继续迭代每个列表，所以我的问题是，一旦找到匹配的 ID，我该如何中断迭代？可能我用错了方法来完成，抱歉让你提前流血了:)

const lists = JSON.parse(localStorage.getItem('lists')) || [];

generatedTrashIcon.addEventListener('click', (event) => {
  deleteTodo(generatedTrashIcon.previousSibling.id);
});

const deleteTodo = (deletedTodoId) => {
  lists.forEach((list) => {
    const findTodo = list.todos.find((todoItem) => todoItem.id === deletedTodoId);

    if (findTodo) {
      const todoIndex = list.todos.indexOf(findTodo);

      list.todos.splice(todoIndex, 1);
      localStorage.setItem('lists', JSON.stringify(lists));
      appendTodosToView(clickedListId);
    }
  });
};

列表对象的输出结构如下：

{
    "id": "1622610431641",
    "name": "Productivity",
    "todos": [
        {
            "id": "1623013270585",
            "todoItem": "code all day!"
        }
    ]
}

一旦满足 .find 方法中的条件，就中断 forEach 迭代

0 个答案: