将react本机中的json对象的值传递给另一个对象

import React, { useState } from 'react';

const SourceComponent = () => {
  const [jsonData, setJsonData] = useState({ name: 'John', age: 25 });

  // 更新json对象的值
  const updateJsonData = () => {
    const updatedData = { name: 'Jane', age: 30 };
    setJsonData(updatedData);
  };

  return (
    <div>
      <button onClick={updateJsonData}>更新Json对象的值</button>
      <TargetComponent jsonData={jsonData} />
    </div>
  );
};

const TargetComponent = ({ jsonData }) => {
  return (
    <div>
      <h2>传递的Json对象的值：</h2>
      <p>Name: {jsonData.name}</p>
      <p>Age: {jsonData.age}</p>
    </div>
  );
};

export default SourceComponent;