如何在React中将子组件状态传递到父组件状态

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

function ParentComponent() {
  const [parentState, setParentState] = useState('');

  const updateParentState = (childState) => {
    setParentState(childState);
  };

  return (
    <div>
      <ChildComponent updateParentState={updateParentState} />
      <p>Parent State: {parentState}</p>
    </div>
  );
}

export default ParentComponent;

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

function ChildComponent({ updateParentState }) {
  const [childState, setChildState] = useState('');

  const handleButtonClick = () => {
    // 更新子组件的状态
    setChildState('New Child State');
    // 调用父组件传递的更新方法，将子组件的状态传递给父组件
    updateParentState(childState);
  };

  return (
    <div>
      <button onClick={handleButtonClick}>Update Parent State</button>
    </div>
  );
}

export default ChildComponent;