在reactJS中，我尝试通过点击按钮在数组中添加一个项目。但无法获取更改的数组

import React, { useState } from 'react';

function MyComponent() {
  const [projects, setProjects] = useState([]);

  // 其他组件代码...

  return (
    // 组件的JSX代码...
  );
}

export default MyComponent;

function MyComponent() {
  const [projects, setProjects] = useState([]);

  const handleAddProject = () => {
    const newProject = { id: 1, name: 'New Project' }; // 新的项目对象，可以根据实际需求进行修改
    setProjects([...projects, newProject]); // 将新的项目添加到数组中
  };

  return (
    <div>
      {/* 其他组件代码... */}
      <button onClick={handleAddProject}>添加项目</button>
    </div>
  );
}