如何在react.js函数组件中将JSON对象添加到数组状态

import React, { useState } from 'react';

function MyComponent() {
  const [data, setData] = useState([]); // 定义一个数组状态

  const addObjectToArray = () => {
    const newObject = { name: 'John', age: 25 }; // 创建一个JSON对象
    setData(prevData => [...prevData, newObject]); // 将新对象添加到数组状态中
  };

  return (
    <div>
      <button onClick={addObjectToArray}>添加对象到数组</button>
      <ul>
        {data.map((item, index) => (
          <li key={index}>{item.name} - {item.age}</li>
        ))}
      </ul>
    </div>
  );
}

export default MyComponent;