setState未更新回调中的状态

Question

我将以下回调与onClick关联。该回调应该基于id从列表中删除要执行的操作。

当我console.log时，我可以验证该逻辑是否有效，但是当我使用setState时，它不起作用。

我也尝试过通过回调函数...我可以确认该回调函数正在被调用，特别是setState函数不起作用。

为什么？

state = {
    todos: [],
    todoToShow: 'all',
  };

CALLBACK:

 handleDeleteTodo = (id) => {
    this.setState((state) => {
      return {
        todos: this.state.todos.filter((todo) => todo.id !== id) ,
      };
    });
  };

待办事项的呈现方式：

    if (this.state.todoToShow === 'all') {
      todos = this.state.todos;
    } else if (this.state.todoToShow === 'active') {
      todos = this.state.todos.filter((todo) => !todo.complete);
    } else if (this.state.todoToShow === 'complete') {
      todos = this.state.todos.filter((todo) => todo.complete);
    }

{todos &&
          todos.map((todo) => (
            <Todo
              todo={todo}
              key={todo.id}
              // id={todo.id}
              toggleComplete={() => this.toggleComplete(todo.id)}
              // text={todo.text}
              onDelete={() => this.handleDeleteTodo(todo.id)}
            />
          ))}```