如何在react js中的两个子组件之间传输数据？

// 父组件
import React, { useState } from 'react';
import ChildComponent1 from './ChildComponent1';
import ChildComponent2 from './ChildComponent2';

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

  const handleDataChange = (newData) => {
    setData(newData);
  };

  return (
    <div>
      <ChildComponent1 onDataChange={handleDataChange} />
      <ChildComponent2 data={data} />
    </div>
  );
};

export default ParentComponent;

// 子组件1
import React, { useState } from 'react';

const ChildComponent1 = ({ onDataChange }) => {
  const [inputValue, setInputValue] = useState('');

  const handleInputChange = (e) => {
    setInputValue(e.target.value);
  };

  const handleButtonClick = () => {
    onDataChange(inputValue);
  };

  return (
    <div>
      <input type="text" value={inputValue} onChange={handleInputChange} />
      <button onClick={handleButtonClick}>传递数据</button>
    </div>
  );
};

export default ChildComponent1;

// 子组件2
import React from 'react';

const ChildComponent2 = ({ data }) => {
  return (
    <div>
      <p>接收到的数据：{data}</p>
    </div>
  );
};

export default ChildComponent2;