如何将功能组件中的父状态组件更改子状态组件

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

function ParentComponent() {
  const [parentState, setParentState] = useState('Initial state');
  
  const updateParentState = (newState) => {
    setParentState(newState);
  }
  
  return (
    <div>
      <h2>Parent Component</h2>
      <p>Parent State: {parentState}</p>
      <ChildComponent updateParentState={updateParentState} />
    </div>
  );
}

export default ParentComponent;

import React from 'react';

function ChildComponent({ updateParentState }) {
  const handleButtonClick = () => {
    updateParentState('Updated state from child component');
  }
  
  return (
    <div>
      <h3>Child Component</h3>
      <button onClick={handleButtonClick}>Update Parent State</button>
    </div>
  );
}

export default ChildComponent;