React 复选框不更新

使用React开发时，我们经常会遇到需要处理复选框的情况。然而，有时候我们会发现复选框的状态没有按预期进行更新。这种情况下，我们需要仔细检查代码，找出问题所在并解决它。

jsx
import React, { useState } from 'react';
const TodoList = () => {
  const [todos, setTodos] = useState([
    { id: 1, text: 'Buy milk', completed: false },
    { id: 2, text: 'Walk the dog', completed: false },
    { id: 3, text: 'Do laundry', completed: false },
  ]);
  const handleCheckboxChange = (todoId) => {
    const updatedTodos = todos.map((todo) => {
      if (todo.id === todoId) {
        return {
          ...todo,
          completed: !todo.completed,
        };
      }
      return todo;
    });
    setTodos(updatedTodos);
  };
  return (
    
      {todos.map((todo) => (
        
                      type="checkbox"
            checked={todo.completed}
            onChange={() => handleCheckboxChange(todo.id)}
          />
          {todo.text}
        
      ))}
    
  );
};
export default TodoList;