javascript - 删除 React TodoList 切换

Question

我想在切换时删除待办事项。下面是代码。

// App.js
const onDone = useCallback(
    (id, done) => {
      if (done === false) {
        setTodos(
          todos.map((todo) =>
            todo.id === id ? { ...todo, done: !todo.done } : todo
          )
        );
      } else {
        setTodos(todos.filter((todo) => todo.done !== done));
      }

      console.log(id, done);
    },
    [todos]
  );

function App() {
  return (
    <List todos={todos} onRemove={onRemove} onDone={onDone} />
  )
}
 

// ListItem.js
<ListItemBlock>
      <div
        className="doneBox"
        done={done}
        onClick={() => onDone(id, done)}
      ></div>
      <div>{text}</div>
      <Remove done={done} onClick={() => onRemove(id)}>
        <TiDeleteOutline />
      </Remove>
</ListItemBlock>

在我写的代码中，我必须单击两次才能删除待办事项，但我想一键删除它。

标签： javascriptreactjs