从React fetch调用组件方法

import React, { useState } from 'react';

const ParentComponent = () => {
  const [data, setData] = useState('');

  const fetchData = () => {
    fetch('https://api.example.com/data')
      .then(response => response.json())
      .then(data => setData(data))
      .catch(error => console.log(error));
  };

  return (
    <div>
      <ChildComponent fetchData={fetchData} />
      <p>Data: {data}</p>
    </div>
  );
};

const ChildComponent = ({ fetchData }) => {
  return (
    <button onClick={fetchData}>
      Fetch Data
    </button>
  );
};

export default ParentComponent;