在react中单击随机div时将数据发送到父组件

// ParentComponent.js
import React, { useState } from 'react';
import ChildComponent from './ChildComponent';

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

  const handleData = (childData) => {
    setData(childData);
  };

  return (
    <div>
      <ChildComponent onData={handleData} />
      <p>Data received from child component: {data}</p>
    </div>
  );
};

export default ParentComponent;

// ChildComponent.js
import React, { useState } from 'react';

const ChildComponent = ({ onData }) => {
  const [randomData, setRandomData] = useState('');

  const generateRandomData = () => {
    // Generate random data logic
    const newData = 'Random data';
    setRandomData(newData);
  };

  const sendDataToParent = () => {
    onData(randomData);
  };

  return (
    <div>
      <div onClick={generateRandomData}>Click me for random data</div>
      <button onClick={sendDataToParent}>Send data to parent</button>
    </div>
  );
};

export default ChildComponent;